Author: wyao2024

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

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

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

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

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

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