Application Design I - Project 3: Low Fidelity Prototyping and Testing

26.11.25 - 12.12.25 (Week 5-9)

PAN RUINING (0378138)

APPLICATION DESIGN / Bachelor of Design (Honours) in Creative Media

Project 3: Low Fidelity Prototyping and Testing


CONTENT LIST


INSTRUCTION



LECTURES

WEEK 10: Usability Testing & UI Kit



What is Usability Testing?
  • Evaluating a product or service with representative users.
  • Participants are tasked with completing specific action while observers record notes. 
  • The primary aim is to detect usability issues, gather qualitative data, and assess overall user satisfaction.
  • It doesn't yield large feedback samples like questionnaires.
How to Conduct UX Research with Usability Testing
  • Prepare a low-fidelity prototype
  • Define three user scenarios and provide written instructions for each
  • Conduct testing via Zoom and send the Figma link to participants.
  • Recruit 3 participants and assign one scenario to each.
  • Gather and analyze feedback from participants using prepared questions.
  • Use the feedback to improve the low-fidelity wireframes.
UI Kit
  • Pre-packaged collection of all UI components for a mobile app or website. 
  • With a UI kit, designers don’t need to create every design component from scratch.
  • Can serve as a starting template for niche-specific use cases (e.g., an e-commerce UI kit), which designers can then customize.
  • UI design has a massive impact on how much time users spend in an app. If the app is well-designed, easy to navigate, and responsive, users are less likely to churn or uninstall the app

WEEK 11: Usability Heuristics


Usability Heuristics

Usability heuristics are general principles or guidelines (Rules of thumb)that designers and usability experts use to assess and enhance the user friendliness and overall usability of products like websites and applications.

1. Visibility of System Status

The system should always keep users informed about what is happening through clear and timely feedback, helping users understand the current system state and feel in control.

2. Match Between System and the Real World

Interfaces should use familiar language, concepts, and visual metaphors that match real-world experiences, making the system easier to understand and more intuitive.

3. User Control and Freedom

Users should be able to easily undo, redo, cancel actions, or navigate back, ensuring they feel in control and not trapped within the system.

4. Consistency and Standards

The interface should maintain consistent visuals, behaviors, and feedback across all screens, allowing users to predict how the system will respond.

5. Error Prevention

The design should minimize user errors by providing clear instructions, confirmations for critical actions, and real-time input validation.

6. Recognition Rather than Recall

The system should reduce cognitive load by allowing users to recognize options and information instead of relying on memory.

7. Flexibility and Efficiency of Use

The interface should support both novice and experienced users by offering customization, shortcuts, and adaptable interaction flows.

8. Aesthetic and Minimalist Design

The design should focus on simplicity and clarity, using visual hierarchy, whitespace, and consistent styling to enhance usability and reduce distraction.

9. Help Users Recognize, Diagnose, and Recover from Errors

The system should clearly communicate errors using understandable messages and visual cues, and guide users toward resolving the problem so they can continue their tasks smoothly.

10. Help and Documentation

The system should provide accessible help and documentation, such as contextual tips, tutorials, and support resources, to assist users in understanding and using the system effectively.


TASK 3: LOW FIDELITY PROTOTYPING AND TESTING

Once the UX design process is completed, students can now create a low fidelity prototype of the app. 

Students need to arrange all the screen wireframes, actions, visual feedback and link them up in Figma. 

Students are then required to perform usability testing whereby they will invite guests to test out their low fidelity prototype and gather all the information, response, feedback, pain points observed
from the test. 

Students need to document this process with video and produce a presentation slide containing detail analysis of this task and the solutions to the problems faced by the testers.




FEEDBACK

WEEK 10: No feedback

WEEK 11: No feedback

WEEK 12: Mr. Sylvain mentioned that the text on my pages is too small, and the add to cart feedback after selecting a milk tea is not clear enough. Users may not be sure whether the item has been successfully added, so he suggested adding a shopping cart icon.


REFLECTION

Experience:
The past few weeks have been very busy. In class, we played a short activity where we had to quickly sketch rough drafts of different app interfaces, which I found very interesting. Building on the previous task, I completed the sketches and wireframes and then started creating the lo fi prototype. At first, I thought it would be simple, but through continuous testing, I discovered many issues that needed to be fixed. I found this process very worthwhile, as each improvement helped make my app better.

Observations:
I observed that many of my subjective assumptions were exposed during the testing process. I also realized that each step needs to be refined and carefully thought through, as a lack of detail can result in poor logical flow and weak connections between steps.

Findings:
I found that testing the flow in Present mode after every few steps is necessary. Without doing this, the prototype connections can easily become confusing, and important steps may be overlooked.


Comments

Popular posts from this blog

TASK 1: EXPLORATION

Interactive Design - Exercise 1

Intercultural Design | PROJECT 1 : PROPOSAL