Introduction

Compared to low-fidelity prototypes, mid-fidelity prototypes address many shortcomings present in initial designs. By incorporating additional animation effects, they achieve a more professional overall appearance. In mid-fidelity prototypes, we strive to ensure all users can browse and retrieve relevant information with greater ease. Simultaneously, we gather feedback to continuously refine the content of the mid-fidelity… Continue reading Introduction

Published
Categorized as Year two

Ethical & Sustainable Design Commentary

The website demonstrates its ethical integrity by incorporating principles of privacy protection, accessibility, transparency, and fairness into its design: it collects only the most essential data and clearly informs users about data usage; its interface adheres to accessibility standards, enabling seamless access for users with varying abilities; and it ensures users maintain full control over… Continue reading Ethical & Sustainable Design Commentary

Published
Categorized as Year two

Feedback & Iteration

I asked three friends for their initial feedback on my mid-fidelity design. Above are their thoughts on my early concepts. I incorporated some suggestions to improve the website design, such as adjusting the guidelines to ensure consistent spacing between images and fixing button sizes that were too large or too small. However, I didn’t fully… Continue reading Feedback & Iteration

Published
Categorized as year one

User-Centred Design Decisions

Decisions made with user needs, goals, usage scenarios, and experience at the core. Users found complex navigation challenging, leading to the adoption of a more streamlined interface structure. This includes combinations of text and images. Interaction design is equally crucial, as it directly impacts each user’s experience. Convenient and clear interaction design helps users minimize… Continue reading User-Centred Design Decisions

Published
Categorized as Year two

Call to Action (CTA) Strategy

In this article, I will explain the different types of CTAs on a website and describe their purpose. CTAs tell users what to do next, reducing cognitive load and enhancing a seamless experience. They also give users a greater sense of control over website navigation. For example, using visually prominent buttons allows users to discover… Continue reading Call to Action (CTA) Strategy

Published
Categorized as Year two

Figma Prototype Walkthrough

I placed the webpage title in the bottom-left corner and positioned the entry button in the bottom-right corner to create visual balance. Then, I placed an animated photo as the background across the entire bottom of the webpage, enlarging the overall image. I adjusted the text color to contrast with the photo’s background, making the… Continue reading Figma Prototype Walkthrough

Published
Categorized as Year two

Initial Wireframes & Layouts

First, an initial wireframe allows me to quickly define the content framework for my project. Through a concise page structure, I can swiftly grasp content priorities and page organization, effectively avoiding distractions from premature discussions about visual styles that might divert attention from the core objectives. Second, as an intuitive visual tool, it provides a… Continue reading Initial Wireframes & Layouts

Published
Categorized as Year two