Role
UI DesignerDuration
Jan - Apr 2024Tools
FigmaAdobe Suite
Skills
PrototypingVisual Design
User Interface
Overview
This project involves the creation of a promotional website for Onitsuka Tiger, a renowned Japanese footwear brand that specializes in casual shoes and classic sneakers. The website features sections highlighting popular aspects of Onitsuka’s most popular and well-known sneaker, the Mexico 66 sneaker. The website also offers purchasing tutorials and ensure a friendly user experience.
Throughout the project, I focused on creating an engaging user experience that adheres to established user interface design principles, ensuring content is both easy to comprehend and retain.The following principles were applied:
-
Miller’s Law
-
Fitts’s Law
- Zeigarnik Effect
- The Multimedia Principle
Project Goals
The primary goal of this project is to design a promotional website for Onitsuka Tiger that effectively showcases the brand's popular Mexico 66 sneaker as an effective, reliable, and stylish sneaker choice. By utilizing UI principles and following best design practices, the website seeks to engage users through intuitive navigation and educational content about the advantages of the products. The ultimate goal is to create an aesthetically pleasing and user-friendly platform that promotes Onitsuka's products and encourages sales.
Project Proposal
Initially, I created a project proposal outlining the laws and principles of user interface design that I intended to apply in my final project. I outlined in my project proposal how I intended to apply each User Interface (UI) guideline to my finished design. View my final project proposal and see a more detailed explanation of how I intended to apply each UI principle by clicking the link below.
User Interface Design Principles
Miller’s Law
Miller’s Law states that the average person can only keep seven (plus or minus two) items in their working memory. With this principle in mind, I designed each tutorial in each section to contain only six steps. I contained one less step from the average seven, so users could navigate and remember the steps slightly easier.
Fitts’s Law
Fitts Law declares that a target's size and proximity determine how long it takes for a user to obtain and interact with it. To utilize this law, I used auto layout to set the distance and size of each graphic button to be the same across all pages, allowing users to interact with each button.
Ziegarnik Effect
The Zeigarnik Effect states that users remember uncompleted or interrupted tasks better than completed tasks. To use this effect, I included a task bar at the bottom of each step that guides the user along each task and fills up as the users complete more and more steps.
The Multimedia Principle
The Multimedia Principle states that users learn better from both text and graphics than from text alone. To help users understand this, I gave users text-based instructions and visual graphics overlaid on top of the images.
Final Prototype
The final prototype features a promotional website for Onitsuka Tiger, showcasing the Mexico 66 sneaker along with purchasing tutorials. Throughout the design process, I adhered to industry-standard design concepts to create a professional, welcoming, and intuitive user interface.
Takeaways
By integrating user interface design principles into the project, I maximized usability and created a product that is intuitive and easy to understand. This experience has deepened my understanding of how users process information, and I am excited to apply these concepts in future creative endeavors.