black
tie 101
Role: UI Designer
Duration: Feb - Mar 2023
Team: Individual
Tools: Adobe XD, Illustrator, and Photoshop
Project Overview
For my User Interface Design II course, students were told to create a prototype for an instructional mobile application or website that teaches users something new. We were also to design using the twenty different user interface design principles to create our prototype.
Goals
- Create a design that takes the principles of user interface design into consideration
- Present content in an easy to understand layout that helps users learn and retain in their memory
- Develop an app or website that allows users to navigate intuitively with ease
Process
Project Proposal
As part of our project, we were all required to submit project proposals. These were presented to the professor and classmates. Once presented, we each received feedback and revised our idea. Attached is a copy of my project proposal.
User Interface Principles
Spatial Contiguity Principle
Definition:
The Spatial Contiguity Principle states that users learn and memorize best when images are placed in close proximity with text nearby.
Application of Principle:
To apply this rule, I inserted text proximate to my images. This ensures that the user fully understands what the page is trying to communicate to them.
Serial Position Effect
Definition:
Serial Position Effect refers to the tendency to remember information more effectively at the beginning and the end of a list rather than in the middle.
Application of Effect:
To take this effect into consideration, I included an overview and summary as the first and last things users see.
Multimedia Principle
Definition:
The Multimedia Principle states that users learn best when they are presented with both images and text together.
Application of Principle:
To adhere to this principle, I paired every image with text to further explain the step to the user. I also added text to the images themselves on top of the captions.
Zeigarnik Effect
Definition:
The Zeigarnik effect suggests that users remember unfinished tasks best. This principle states that showing the users their progress and status motivates them to complete the rest of the tasks.
Application of Effect:
I took this rule into consideration when I added a list of steps on every task page. This is to indicate to users where they are in the task and how much they have left to complete. I also highlighted the current step that users are on.
Final Product
View Final ProductFinal Thoughts
I enjoyed working on this project and the creative freedom it gave me. I learned a lot about working alone and about myself as a designer. I refined my skills in Adobe XD and picked up some new tricks along the way. This project also furthered my understanding of the UX principles. Through the project progress presentations, I became more confident speaking about my design choices. I also grew more comfortable receiving and applying feedback.
