INTERACTIVE DESIGN - EXERCISE 1

Samantha Jizan Amrullah / 0375606

Interactive Design / Bachelors of Design (Honors) in Creative Media / Taylor's University
Task 1


Exercise 1
Write your report in e-portfolio

Choose FIVE (5) 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.
Write a brief report summarizing your findings and recommendations.

What To Have in The Analysis:

Consider the purpose and goals of the website, and evaluate whether they are effectively communicated to the user.
Evaluate the visual design and layout of the website, including its use of color, typography, and imagery. Consider the functionality and usability of the website, including its navigation, forms, and interactive elements. Evaluate the quality and relevance of the website's content, including its accuracy, clarity, and organization. Consider the website's performance, load times, responsiveness, and compatibility with different devices and browsers.

Deliverables:

Write a brief report summarizing each Web Analysis in not less than 200 words. You can include a screen capture of each section or page of the website to explain. Make sure that the formatting of the report is clear (headings/subheadings)


LECTURES

Week 2:


key principle of usability:

consistency

simplicity

visibility

feedback

error prevention


consistency is a key factor for visual element and functionality,, ensures web looks coherent with all the positions on its proper place (eg logo is always on top left corner)

typeface is consistent with consistent font size. if all the rounded corners of all images radius is all consistent size. 

page layout and branding (eg following the guideline of the brand)

the arrangement in usual mobile apps cannot go more than 2 coloumn


simplicity is used loosely to inimize the number of steps. when users see too much information all at once they will feel overwhelmed. simplicity not just the design, but also the steps. 

the simpler the easier to navigate


visibility is how visible the elements are, the more the users will know about them and how to use them. for example if something is out of sight, its going to be hard to know about and use.

users should know just by looking at an interface what their options are and how to use them.


 Feedback communicate the result of any interaction, making it both visible and understandable. its job is to give the user a signal that they (or the product) have succedeed or failed at performing a task. (eg progress bar or small animation that lets you know when you eg move file into folder etc) or when successful payment is always shown in green color.


Error prevention it involves alerting a user when theyre making an error, with the intention to make it ez for them to do whatever it is they are doing without making a mistake. (eg indicating that you need a stronger password when creating a password)


avoid complex interfaces, confusing navigation, avoid poor feedback, inadequate error handling.




EXERCISE 1

Website 1


The website employs a clean, scroll-based layout with subtle animations, creating an immersive experience. Its responsive design ensures accessibility across various devices. The integration of background music adds an emotional layer, fostering a contemplative mood.​ the site's smooth animations and interactive elements suggest the use of modern web technology. 

While 24Reflection is thoughtfully designed and emotionally engaging, it does have some notable weaknesses. First, the site offers limited interactivity; it mainly invites visitors to scroll and read without providing options for comments, reactions, or deeper engagement. This can make the experience feel somewhat passive. Additionally, because the content is deeply personal and centered around the author's specific experiences, it may not resonate broadly with visitors outside of their personal circle. Navigation is another minor issue — the site relies heavily on linear scrolling, and there are no obvious quick links or section markers, which could make it less user-friendly for someone wanting to revisit specific parts. Performance-wise, although smooth overall, the use of background music and animations could potentially slow down the site on lower-end devices or weaker internet connections.


Website 2


MailGamer operates by sending game moves via email, enabling asynchronous gameplay between participants. This approach is particularly appealing for those who enjoy turn-based games and prefer a leisurely pace. While MailGamer has a charming and nostalgic concept, there are several areas where it could improve. Currently, the platform offers a limited selection of games, which may restrict its appeal to users looking for more variety; expanding the game library would help attract a wider audience. Additionally, while the minimalistic user interface keeps things simple, it could benefit from more polished design elements or interactive features to make the experience more engaging and intuitive. Lastly, since the platform operates entirely through email, it is crucial to address user privacy and security concerns; providing clear, transparent information about how user data is handled would greatly strengthen trust and credibility.


Website 3


Website 4


Bruno Arizio's website serves as an immersive digital portfolio that showcases his expertise as a globally recognized independent designer and creative director based in the Netherlands. The website employs a minimalist and modern design, utilizing a monochromatic color scheme that emphasizes content over embellishment. The use of grid lines and horizontal scrolling creates a magazine-like experience, allowing users to navigate through projects seamlessly. Subtle animations and interactive elements enhance the user experience without overwhelming the content.​ This website is a well-crafted portfolio that effectively communicates his design philosophy and showcases his diverse body of work. The combination of minimalist design, thoughtful content organization, and technical proficiency results in a user-friendly and visually appealing experience. For potential clients and collaborators, the site offers a comprehensive overview of Bruno's capabilities and creative vision.​

The heavy use of horizontal scrolling, although stylish, can be less intuitive for some users who are more accustomed to vertical navigation, potentially causing slight usability friction. Additionally, the site's minimalist style, while elegant, occasionally borders on being too sparse  for users looking for deeper background information or case study details, the brief project descriptions might feel a bit too surface-level. From a performance standpoint, the reliance on high-resolution media, animations, and advanced web technologies means that the site may load more slowly or experience lag on older devices or slower connections. Finally, accessibility could be an issue, as the design prioritizes aesthetics over features like keyboard navigation, text alternatives for visuals, or screen reader support.

Website 5


Cocota Studio's website effectively communicates the agency's design philosophy and showcases its diverse body of work. The combination of minimalist design, thoughtful content organization, and technical proficiency results in a user-friendly and visually appealing experience. For potential clients and collaborators, the site offers a comprehensive overview of Cocota's capabilities and creative vision.​ Even though Cocota Studio’s website appears professional and creative, it does have a few weaknesses. First, the heavy use of horizontal scrolling looks interesting, but it’s not very intuitive as some people might find it confusing or annoying, especially on phones or if they’re not used to that style. Also, while the minimalist design is clean and stylish, sometimes it feels a little too empty. There’s not a lot of detailed info about their projects, so if someone wants to really understand their work or process, it might feel a bit shallow. Another thing is that because the site uses a lot of high-quality images and animations, it can load pretty slowly on older devices. Finally, accessibility seems a bit overlooked — there aren’t many features to help people who might need screen readers or easier navigation. Overall though, the site still leaves a really strong and creative impression.


Website
https://www.agencepony.fr/

Website
https://www.lidiaeamato.com/










Comments

Post a Comment

Popular posts from this blog

INTERCULTURAL DESIGN TASK 3 - FINAL PROJECT

Image
In this project, we are going to finalize our idea, compiling it into a set of information and data. For the final project, we are all tasked to create a tiktok account that holds all of the research and output of our task. The tiktok account that we are posting them in will be a compilation of videos based on our work that we have worked on for the task within the semester. As our main topic is about the everyday design, we as a group have decided to pick the main focus of traffic signs in Indonesia as a point of interest. We emphasized how traffic is so prevalent not only in Indonesia, but throughout various densely populated countries like Malaysia as well, that it has became a culture of its own. Bad driving habits has contributed to the horrible traffic across the countries that it has turned into an everyday culture.  As a group, we decided to tackle one of the sign that has contributed to the horrible congestion and bad driving culture, which is the “belok kiri jalan terus” ...
Read more