Interactive Design Exercise 1

Interactive Design Exercise 1

Week 02-Week 03

Siam Siew Yong 0358399

Bachelor of Design in Creative Media | Taylor’s Design School | Taylor’s University

 

INTRODUCTION

EXERCISE 1: Web Analysis

Objective- We required to choose TWO(2) websites from the link given by sir and write a report summarizing our findings and recommendations

First website- Watson

Purpose

Watson is a portfolio website created by Watson Design Group, an independent digital creative studio, founded in 2005. Their projects range from all-encompassing web campaigns to smaller, integrated viral elements and digital marketing initiatives.

This website aims to attract potential users by showing their nice portfolio. In addition, the website also outlines clearly the services offered by Watson, including branding strategy, digital design and more.

Visual Design and Layout

Color palette: This website employs a minimalist color palette, black and white. It looks clean and modern. This design also allows the featured title to take center stage and enhance overall readability.

Typography: The website uses sans-serif fonts that make the client easy to read on screen. Their heading, subheadings, and body text define a great hierarchy that guides the client through the content smoothly.

Image: This website also presents high-quality images of their work throughout the obvious position on the pages. The layout of the image effectively showcases the studio's professionalism and catches the client's attraction.   

Functionality and Usability

Navigation: The website features links to essential sections such as 'Partnership', 'Capabilities', 'Conversation', and 'About'. The fixed navigation bar allows users to access other parts of the website easily. (always on the upper right)

Interactive element: The website incorporates smooth transitions and hover effects that elevate the client's experience. It also creates a more dynamic and engaging browsing experience.

Content quality and relevance

Accuracy: The content is presented accurately and reflects the purpose and capabilities of the studio. The descriptions are clear and allow users to find out the creative process of the studio easily.

Clarity: The content is well-organized and concise. It allows users can understand the studio's services and portfolio quickly.  

Besides, the content is highly relevant to the target audience (businesses and individuals seeking creative solutions). Their portfolio showcases the studio's capabilities and aligns with the branding. 

Performance

Load time: The website loads quickly and smoothly, even with the inclusion of high-resolution images and animations. Quick load times are crucial for keeping users engaged and encouraging them to explore the site further.

Responsiveness: The site is fully adaptable and works seamlessly on various devices, including smartphones and tablets. The layout remains visually appealing and functional across all screen sizes, providing users with a consistent and enjoyable experience

The most important is the website can perform well across many browsers such as Safari and Chrome. While browsing the website, users do not experience compatibility problems. 

Weakness and recommendation

There is limited information on specific services, and more detailed descriptions could aid potential clients in understanding offerings. 

The studio can incorporate more case studies that illustrate the creation process and results, to provide potential clients with a deeper understanding of their capabilities.

Besides, the studio can also add a search function to allow users to find quickly the projects or content, improving the overall flexibility.

Second website- Clarisse Michard

Purpose

The Clarisse Michard website serves as an online portfolio that showcases her creative work, skills, and design philosophy.  This website aims to display her best work and capabilities, which allows potential users or partners can find her business. The website also offers them a way to contact her services. 

Visual design and layout

Color scheme: The color scheme of the page can be changed, but Clarisse ensures simplicity of the overall website, using only two colors throughout the page. The website features a soft and minimalistic color palette that enhances the her work.

Typography: The typography is modern and clean, using sans-serif fonts for improved readability while maintaining style. A well-organized text hierarchy, with clear headings and subheadings, helps guide users through the content efficiently.

Imagery: Imagery: A collection of images combined into a short, high-quality video effectively showcases Clarisse's work. Full-screen visuals and project images provide an immersive experience, drawing visitors in and highlighting her skills. 

Functionality and Usability

Navigation: The navigation is user-friendly, featuring clear links to essential sections like 'Instragram', 'Contact', 'Dribble',and 'Linkedin'.  Especially 'Dribble' link which can connect to a website with more portfolios and detailed information about designer. 

https://dribbble.com/cla-mhrd

Interactive Elements: The website includes smooth transitions and hover effects that enhance the user experience. These subtle yet effective features contribute to a modern and engaging browsing experience.

The ripple effect on the text and hover effect in the overall pages engage the user's experience and increase interactivity, making the browsing experience more enjoyable

Content quality

Accuracy: The content is spot-on and accurately represents Clarisse's vision and capabilities. The project descriptions clearly convey her design approach and creative process.

Clarity: The information is clear and easy to understand, making it simple for users to get a quick sense of Clarisse's services and portfolio.

Relevance: The content is well-tailored to the target audience, effectively showcasing Clarisse's skills and aligning with her branding to attract businesses and individuals looking for website designers.

Performance

Load time: The website loads quickly, even with the use of high-resolution images and animations. 

Responsiveness: The website is fully responsive, and works smoothly on various devices such as smartphones and laptops. Even when displayed on different screen sizes, it still maintains visual appeal and readability. 

Browser Compatibility: The site performs well across major browsers, including Chrome and Safari, without any significant compatibility issues, ensuring accessibility for a wide audience.

Weakness and recommendations

The portfolios are combined into a short video, but the playback speed is too fast, which makes it difficult for viewers to focus on particular works and details. 

Slowing down the speed or adding basic controls like a pause or replay button would greatly improve the viewing experience, and allow users to fully engage the content.