Interactive Design - Exercises

23/04/2024 - /04/2024 (Week 01 - Week 08)
Nadhrah Binti Abdul Razak / 0359620
Interactive Design / Bachelor of Design (Hons) in Creative Media
Exercises

INSTRUCTIONS

Our first task requires students to do a total of four (4) exercises. This task will show competencies in understanding web development through prototyping and development processes. The four exercises are as follow:

EXERCISE 1: WEB ANALYSIS
For our first exercise, web analysis, we are assigned to analyze an existing website and identify areas for improvement. Students were given link from our lecturer and are required to review the website while taking notes of its design, layout, content, and functionality.

Website #1 - https://www.rayraylab.com/

Introduction
Rayraylab is a solitary agency that specializes in crafting unique and customized websites. The rayraylab aims in understanding brands and delivering clients' tailored solutions while being able to create engaging experiences that leave a lasting impact on users. In this report, we will be analyzing the website as well as discussing the factors regarding its advantages and disadvantages.

Key Findings
Based on my first impression upon visiting the website, the first thing I noticed was how minimalistic the overall design was. This provides a more clean, focused, and user-friendly experience. Furthermore, when layouts have a more minimalistic design, it enhances the readability for viewers since it prioritizes legibility by using ample white space, clear typography as well as organized contents.


Fig 2.1, Minimalistic Design

To add on, the RayRaylab website demonstrates a smooth and intuitive progression for users' journeys as they navigate through the site. When a website has a nice flow, its able to ensure the consistency throughout, regardless whether the user is viewing the website on desktop, smartphone, tablet, or other devices. It maintains the same smooth navigation and user-friendly interface across all platforms.


Fig 2.2, RayRaylab on Mobile


Content Analysis
A unique feature I noticed when researching the website is that the contents are contained within a single page. This means users can access all the information by simply scrolling instead of having to click different buttons to navigate to other tabs. Additionally, there is an option to navigate quickly to different sections if users prefer not to scroll through the entire page.

Although the website is well-polished, there are some areas that could be improved to enhance the user experience. For instance, the website experiences slow page loading times due to its animations. While the website boasts a well-designed and minimalistic layout, slow loading speeds can deter users and result in a negative experience for them.

Conclusion
In conclusion, RayRaylab's website provides a unique all-in-one page design, enabling easy navigation through scrolling or tab selection. While its polished layout is impressive, slow loading times attributing to animations, present usability concerns. By addressing these issues, it  could further enhance the user experience, ensuring the website aligns with its goal of providing engaging and accessible digital experiences.

Website #2 - https://dontboardme.com/

Introduction
The "Don't Board Me" website provides a service that can be a refreshing experience in the world of pet care. The company specializes in in-home services that are tailored to meet the unique needs of your furry family member. Whether it's dietary requirements or playtime activities, they strive to make your pet's time at home enjoyable and stress-free.

Key Findings
When I first encountered this website, it immediately intrigued me. Upon opening it, I noticed an interactive feature that transforms your cursor into a dog ball. Additionally, the color palette is bright and colorful, which can quickly catch a user's attention. Vibrant colors are known to leave a memorable first impression as they can stand out from competitors.


Fig 2.3, Colorful Website 

 
Fig 2.4, Dog Ball Cursor

Additionally, the website consists plenty of animations. This creates an interactive engagement for users in a more dynamic way; it is memorable and highlights the important content. Moreover, animations can make the browsing experience more interactive and immersive, encouraging users to explore and interact with the content.

Content Analysis
Looking at the content made me realize that the message they tried to convey is very clear and easy to understand. The emphasis on certain words really helped in highlighting the importance of their message. To add on, they made sure to include the pricing of their services on the website so that potential customers that are intrigued can simply check it there.

Furthermore, the overall layout of the website is very easy to navigate. It makes it more accessible to a wider range of users, for example, those who are not used to using the internet, older people and others. When websites are easy to navigate, users are more likely to explore the page and increase interactions.

Conclusion
Overall, I find the whole website to be very well-polished with an attractive design. And, with the help of easy navigations, there are no doubts that users will struggle using the website.

EXERCISE 2: WEB REPLICATION

A. Ocean Health Index



Fig 1.1a, screenshot of website


EXERCISE 3: Creating a Recipe Card

For our third exercise, we are required to create a website that consists of a recipe card. From the recipes link given by Mr Shamsul, I have chosen to choose Simple Bruschetta as my recipe. 

I used Adobe Dreamweaver to create my website and uploaded it on Netlify.
Link to my Recipe Card





Comments