Interactive Design — Exercise 1: Web Analysis
Chan Zhi-Ren Zenndan / 0369069
Interactive Design / Bachelor of Design (Honours) in Creative Media / Taylor's UniversityExercise 1: Web Analysis
Table of Contents
1. Instructions
2. Web Analysis
1. Instructions
Document 1.1 Module Information Booklet (21/04/2025).
For this task, I need to choose five websites from the list of links provided by our lecturer on Teams. I’ll be analysing and reviewing each website in my blog, focusing on their design, layout, content, and functionality. Each review must be at least 200 words long. While documenting my analysis, I should also include screenshots to show my process and support my observations.
The websites I have chosen to analyse are as follows:
2. Web Analysis
2.1 Bold Creatives
Purpose & Goals
The website’s purpose is immediately clear on the landing page. It offers website design and brand identity services, aiming to help brands stand out and succeed in their market. This message is supported by a prominent “Get a project quote” button, creating an effective call-to-action. The headline is direct and impactful, clearly targeting potential clients.
Fig 2.1.1 Call-to-action button is highlighted (24/04/2025).
Visual Design & Layout
The visual design uses a minimal black-and-white color scheme, maintaining a clean and modern aesthetic. Typography is consistent, using a sans-serif font that feels both professional and easy to read. Imagery focuses solely on project showcases, with no distracting visuals. Alignment is present and white space is well-balanced, contributing to a polished and clutter-free layout.
Fig 2.1.2 Ample negative space (24/04/2025).
Functionality & Usability
Navigation is straightforward, positioned at the top center. The contact page is clearly structured, with the email highlighted for visibility. Interactive elements like buttons and links have subtle hover effects, which improve engagement. No errors or broken links were encountered during navigation.
Content Quality
Content is aligned with the website’s goals. The message is clear, relevant, and professionally written, effectively communicating their services. Each section serves a clear purpose and flows naturally into the next. Headings and text are easy to identify, and there’s just enough detail to inform without overwhelming. The tone stays consistent and professional throughout.
Performance & Compatibility
The website loads quickly and functions smoothly across various devices. It is fully responsive, offering a consistent experience on desktops, tablets, and smartphones.
2.2 Wandergates
Purpose & Goals
The purpose of the website is immediately clear upon landing. Centered on the homepage is a bold, direct message: “Premium photography for hospitality brands.” It clearly communicates that the site offers eye-catching photography and videography services specifically for hotels, resorts, and lifestyle brands. This concise statement sets the tone and target audience right away.
Fig 2.2.1 Purpose of the website is heavily emphasized upon landing (24/04/2025).
Visual Design & Layout
The site uses a clean and modern design. Teal is the primary color, which aligns well with the hospitality theme, while black is used for typography and the logo, maintaining strong readability. The imagery is all original work, displaying their professional photography across the page. Negative space is used effectively, keeping the layout uncluttered and visually balanced.
Functionality & Usability
Navigation is accessible through a menu button instead of being visible on the homepage, which slightly impacts convenience. However, once opened, the menu includes all key sections like ‘About’ and ‘Contact’. Pages like the contact form are well structured and function as intended.
Content Quality
Content supports the site’s goals by showcasing previous work through well-organized visual sections (triggered by cursor movement). Services are clearly categorized by type such as architecture, lifestyle, and videography, making it easy for users to explore. Smooth transitions enhance the experience without distraction.
Fig 2.2.2 Neat feature showing photos when moving the cursor around (24/04/2025).
Performance & Compatibility
The website performs well with fast load times and minimal animations. Hover effects provide interactivity, and the layout adapts smoothly to different screen sizes across phones and tablets without breaking any elements.
Fig 2.2.2 Supported devices (24/04/2025).
2.3 Anthony Fonte
Purpose & Goals
This designer’s portfolio clearly communicates its purpose from the start. His name and job specialization are prominently displayed, framing the website as a personal showcase of his background and projects. The site is meant to inform and impress potential collaborators or employers by highlighting his creative work and expertise.
Visual Design & Layout
The website uses a minimalistic design with dynamic color changes as you scroll. For instance, the background shifts from white to black when presenting his Mercedes-Benz project, aligning with the dominant tones of that brand. This approach creates visual interest while maintaining consistency. All images featured are from his own projects, contributing to a clean and cohesive layout without distractions.
Functionality & Usability
Navigation is smooth, with a fixed navigation bar located on the right side that stays visible as users scroll. While there is no contact form, his LinkedIn and email are clearly displayed for easy communication. Interactive elements are minimal but function well, and no technical issues or broken links were encountered.
Content Quality
Content is focused and relevant to the site’s goal. The information about the designer is professionally written and clearly organized. There are no off-topic or unnecessary sections, and the tone remains consistent throughout.
Performance & Compatibility
The website runs efficiently with quick load times and responsive behavior. It adapts well to most screen sizes, though some mobile views show overlapping text and uneven spacing, which slightly affects the overall user experience.
Fig 2.3.3 Overlapping text and indent error on some mobile devices (24/04/2025).
2.4 Savic Motorcycles
Purpose & Goals
The website introduces its latest electric motorcycle right on the landing page, immediately establishing its purpose. Two bold call-to-action buttons, “Order Now” and “Test Ride,” draw user attention and encourage immediate engagement. These elements are effective in guiding visitors to explore or take action, supporting the brand’s focus on promotion and customer conversion.
Fig 2.4.1 Prominent call-to-action buttons (24/04/2025).
Visual Design & Layout
The design uses a minimalist black and white color palette. The white background and black typography ensure clear readability. Imagery focuses on showcasing the latest motorcycle models, accompanied by technical details. The layout is clean, and the use of white space keeps the overall appearance neat and modern.
Fig 2.4.2 Sleek and clean layout (24/04/2025).
Functionality & Usability
Navigation is located at the top center of the page and includes hover effects for interactive feedback. The newsletter and contact options are less accessible, found only at the bottom of the page. Overall, the interface is smooth and easy to use.
Content Quality
Content is informative and persuasive. It clearly explains electric motorcycle concepts and highlights the unique specifications of each model. The series are well-organized into separate sections. The tone promotes innovation and reflects confidence in the brand’s products.
Performance & Compatibility
The website loads quickly and runs smoothly. It is responsive across various screen sizes and compatible with most devices without any issues.
2.5 Clement Grellier
Purpose & Goals
This portfolio website introduces the designer as a front-end developer with a clear opening statement of his web design proficiency. Next to that is a personal introduction and a highlighted call-to-action button encouraging visitors to view his projects.
Fig 2.5.1 Simple and minimalistic landing page (24/04/2025).
Visual Design & Layout
The site uses a classic black and white color scheme with bold sans-serif typography, reinforcing a clean and professional appearance. Imagery consists of project showcases, placed with ample white space throughout for a neat and breathable layout.
Functionality & Usability
Navigation is located at the bottom center, which is a non-traditional but intentional design choice. While there is no contact form, a 'say hello' button on the about page allows users to send an email directly through their device, adding an interactive touch that’s simple yet effective.
Fig 2.5.3 Simple and straightforward contact button (24/04/2025).
Content Quality
The content centers around the designer’s background, work experience, project highlights, and tools he uses. It includes personal touches like a Spotify playlist, keeping the tone both professional and engaging. Content is well-organized across three pages, making it easy to navigate and digest.
Performance & Compatibility
The website loads quickly thanks to minimal animations and smooth transitions. It is fully responsive, adapting well across desktops, tablets, and phones. Interactive elements work consistently on all devices, and content remains clear and well-structured even on smaller screens. Overall, performance is stable and optimized for a seamless user experience.
Comments
Post a Comment