Interactive Design (GCD60109)

 23.04.2024 - 30.04.2024 / (Week 1 - Week 2)

Jovan Cornelius Irwan / 0364526

Interactive Design / Bachelor of Design (Honours) Creative Media / Taylors University 

Lectures

Usability: Designing Products for User Satisfaction

The term "usability" describes how well, quickly, and smoothly a certain user can make use of a product or design in a given circumstance.
It's a component of UX (user experience) design. This is UX Design's second level.
The degree to which a design's features meet the demands and circumstances of its users determines how usable it is.
When users first come across an interface, they should be able to navigate it easily enough to accomplish their goals without needing assistance from an expert.
A highly usable interface leads people through the simplest path to accomplish their objective.

Principle of Usability

Key Principle of Usability

1.Consistency

2.Simplicity

3.Visibility

4.Feedback

5.Error Prevention

1. Consistency

Consistency is key in web design for both functional and aesthetic reasons. You can ensure that the headers, footers, sidebars, and navigation bars of your website all appear and work well together by keeping them all consistent. Consistency is a hallmark of intuitive design. It is made up of a trustworthy navigation system, page layout and menu structure, typography and typefaces, and branding in web design.

2.simplicity

The notion that user interfaces ought to be "simple" Generally speaking, simplicity is the need to minimize the number of steps in a procedure, using terminology and symbols that maximize interface clarity, and make errors more difficult to commit. Simplicity in design will lead to better user interfaces since it will enable users to achieve their goals more rapidly and efficiently while also offering a superior user experience.

3.visibility

The fundamental idea behind visibility is that the more visible a feature is, the more probable it is that users will notice it and understand how to utilize it. The converse is also important: it is harder to learn about and apply something that is hidden. Users should be able to easily identify their alternatives and find out how to access them through an interface.

4.Feedback

Feedback communicates the results of every contact, making them clear and understandable. Its purpose is to inform the user whether or not they (or the product) have finished a task satisfactorily. The expectation that navigation items on desktop or laptop computers will load a separate menu or change color when you move over them is one example of feedback. 

5.Error Prevention

In order to make it easier for users to do tasks without making mistakes, it involves warning them when they are making mistakes. Because humans are imperfect and will always make mistakes, the error prevention principle is crucial.

INSTRUCTION

TASK 1

Choose TWO (2) websites from the link given. Review the website that you've selected carefully, taking note of its design, layout, content, and functionality. Identify the strengths and weaknesses of the website, and consider how they impact the user experience.

1.FITEG2

https://www.fiteg2.lv/en

1.purpose and goal

A protein website's main goal is usually to offer resources, products, and information about consuming protein. The common purposes and goals is to offer articles, blogs and education to educate the readers about the importance of proteins in the diet , furthermore the website itself provides detail information about different types of protein sources and how they can include into various diets. lastly, other than providing a details information and to educate the readers, it can as well offering a recipes, meal plans and cooking tips to the individuals into their daily meals . A protein website should function as a comprehensive resource for people looking for advice, and information about eating protein and its advantages.

2.Visual Design & Layout

the way they advertise their product is very creative like floating product , Visual design for a website plays an important role in capturing visitors' attention and enhancing user experience. The fonts itself are easy to read and complement the overall design , the layout is quite clean and organized with the result that it guides users through the content. additionally, they can advertise products creatively

3.Functionality & Usability

Firstly, from the web above as the website user point of view we can see that this website gives a very clear explanation about the product they sell which is protein smoothie. They also insert pictures about their product which makes the website user can understand and see how many egg whites and protein does their product have. Secondly they also add some highlights and tips about ways to use or consume their product if the consumer wants another way to consume the product

4. strengths 

this page is my favourite because they provide us a nutrition information and their product

A strength protein website usually caters to people who are interested in improving their athletic performance, muscle building, and strength training. Besides that, impartially evaluating and endorsing various protein products according to criteria including flavour, potency, and affordability. in conclusion, the strength of this website is to empower individuals to achieve their fitness goals by providing them with the information, products, and support they need to succeed in their strength training endeavors. They also provide how to use their product 

5.weaknesses

When attempting to navigate a website . Even if I change the language, it cannot be returned to English. A website with a lot of blank space may come seen as amateurish or incomplete. In order to develop a layout that is visually appealing, it is vital to balance white space with content. Additionally, The home page's size will change to accommodate a smaller screen when viewed on a cellphone, improving the user experience. But when seen on a laptop or PC, the size can seem smaller, which could confuse users because different devices have different layouts and designs.

2.DONT BOARD ME

https://dontboardme.com/

1.purpose and goal

This website's purpose and objectives are motivated by a strong dedication to providing for the special requirements of our dog friends. Our mission is to enable dog owners to provide their pets with the finest care possible by offering a plethora of articles and resources on health, breeds, and dog care. However, it doesn't end there. We're passionate about creating a thriving community where dog lovers can congregate to exchange stories, solicit guidance, and celebrate the pleasures of dog ownership. Our mission goes beyond merely dispensing knowledge. By doing this, we hope to establish a platform that helps people as well as highlighting our four-legged companions and making sure they get the love, care, and attention they need.

2.Visual Design & Layout

A breath of fresh air in the frequently congested online world is this website design. It's similar to entering a warm, well-stocked pet store where everything is well marked and easily accessible. You can really picture the smiling smiles of the employees extending a warm greeting to you as they lead you down the aisles. The design of this website is friendly and user-friendly, much like in that store, making it enjoyable to explore. Dog owners can spend time there with confidence knowing that they will always find what they need without difficulty. It's more than just a website; it's a kind companion on the path to pet ownership, and that's what makes it so enticing.

3.Functionality & Usability

The functionality of the website is explaining about what services can the daycare do for our pets and how do we apply for our pets on the daycare, thus they also give some price list for walking the customer's dog. In addition, the website also give some testimonials in order to gain the customer trust. 

4. strengths 

The qualities of a dog website may be compared to the ardor and commitment of a committed dog owner. It would represent the loving nature of a conscientious caregiver by painstakingly compiling a wealth of information regarding dog breeds, health, training, and care. The website would provide companionship in addition to knowledge by featuring engrossing articles, touching films, and thought-provoking podcasts that speak to the love and happiness that dogs bring into our lives. It would encourage a lively community or forum where members can share tales, trade advice, and create enduring connections, emulating the warmth and camaraderie seen among dog lovers. It would be similar to a lively get-together of fellow dog aficionados. Additionally, the website would place a high priority on an easy-to-use interface, making users feel supported and welcomed, much like a faithful friend.

5.weaknesses

Weaknesses could include content that is out-of-date or erroneous, a lack of interaction or engagement, a lack of resources for specialised issues, the tendency to overwhelm users with information, and the challenge of making one's website stand out among the plethora of rival dog websites.

TASK 2

in the task2 we asked to replicate two website to understand website structure

i choose Morgan Stanley and Ocean Health Index

website1

progress

First, I start by applying guidelines to ensure that I can place the font and image exactly like the original website, and this helps me a lot. After that, I look for a font type that is similar to the original website's font, which is the most challenging part because there are many fonts to go through to find the right one. Then I search for an image that suits the topic, and I also need to adjust the spacing between letters to make sure

everything is in the exact place as the original.

THE RESULT:

website 2

progress

basicly the progress is the same as the previous but the diffrent is only i must trace the logo and using elements such as rectangel or rounded rectangel also we need to set the oppacity to make similar to the original website

THE RESULT:

exercise3

link: https://warm-cobbler-7f973c.netlify.app/

FEEDBACK

FURTHER READING