Interactive Design | Project 1: Proposal
06.04.2025 - 0.05.2025 (Week 1-6)
FEILYCIA JOY KURNIAWAN / 0373400
Interactive Design / Bachelor of Design (Honors) in Creative Media
Task : Exercise 2
TABLE OF CONTENTS
1. Lectures
2. Instruction
3. Project 1: Proposal
4. Feedbacks
5. Reflection
LECTURES
What Makes a Bad Website Design?
https://kijo.co.uk/blog/worst-websites-bad-design-examples/- Cluttered & confusing aesthetic and layouts: avoid outdated design, too many elements can be overwhelming. The design should be clean and straightforward but visually appealing.
- Slow loading: 47% of users won't wait longer than 2 seconds for a website to load (Sweor).
- Poor UX & lack of accessibility: intrusive pop-ups, advertisements, inconsistent elements. Not using a certain accessibility standards such as alt texts on images.
- Irrelevant, badly written content: can make the website looks shady and untrusted.
- Not being mobile responsive: for easy access.
HTML
- what is HTML and how?
html describes the structure of pages, comes in pair (opening & closing). Inside the opening and closing, is the information/documents. “everything is wrapped”
example:
<element>information</element>
html consist of everything in the website (body, head, title) footers lives inside body
<> html { } CSS
- block elements
some elements will always appear to start on a new line in the browser window (top to bottom), this is called block level elements. (ex. <h1>,<p>,<ul>,<li>)
- inline elements
some elements will always appear to continue on the same line as their neighboring elements (ex. <b>,<i>,<img>,<a>)
- lists
ordered list <ol> - list where each item in the list is numbered (1,2,3/ a,b,c) unordered list <ul> - list that begin with a bullet point list item <il> - the content is inside this code “li”
indentation is by default or can press “Tab”
- links
internal link - in one tab external link - opens a new tab
type of links :
link from one website to another link from one page to another in the same website link from part of a web page to another part of the same page link that opens a new browser window (tabs)
- attribute
consist of attribute name & value
- ID attribute
every html element can carry the ID attribute is a unique identity for 1 element and cannot be duplicates allowing you to style it differently from any other elements (ex: u want to change the style of 1 paragraph amongst other paragraphs)
- class attribute
every html element can also carry a class attribute class/group the elements you want to change and change it tgt the class attribute on any elements can share the same value/name
- div (generic html element)
<iframe src="https://drive.google.com/file/d/1mCdt8a0NYM_1dywRFz8BkemNZhHlw2t9/preview" width="640" height="480" allow="autoplay"></iframe>
PROJECT 1 : PROPOSAL
- Evaluate the current site to identify design, usability, and performance issues.
- Upgrade functionality such as a better reservation system and richer visual content.
- Improve user experience by making the site more accessible, easier to navigate, improve usability and layouts
- Upscale Akar Dining’s identity using the redesigned website.
FEEDBACKS
REFLECTION
Comments
Post a Comment