Timeframe

2 Months

Role

UX/UI Designer

Team Members

Tony Ramirez (Me) & Maya Arnold

Figma Link

Write-Up

Instructional Design Project for AirBnb

We were tasked to develop an informational website/app prototype designed to teach its users something new. Using different laws and principles of user interface design to guide our process, we were tasked to demonstrate our ability to produce an interface that allows users to have an intuitive and smooth navigation experience, as well as present content in a way that is easy for users to understand and memorize information.

Goals

Our goals for this project were to produce an interface that allowed users to have an intuitive and smooth navigation experience, present content in a way that was easy for users to understand and memorize information and design an interface that took into consideration the various laws and principles of user interface design that we learned over the course of the semester.


Write-Up

To start off, we put together a project write-up that described how we would plan to use various laws and principles of user interface design in our final project. In our project proposal, we explained how we would plan to use each UI principle in our final design. Check out the link above to view our final project proposal and learn how we planned to use each UI principle in more detail.

User Interface Principles

Zeignarik Effect

The Zeigarnik Effect is a principle that states that people tend to remember incomplete tasks better than completed tasks. We considered this principle in our final project by including a progress bar at the bottom of each screen in our project for each mini-tutorial. This allows the users to know how many steps there are, which steps they've completed, and how many steps they have left.

Progress Bar

Informs users of any incomplete tasks they have left.

Multimedia Principle

 Multimedia Principle emphasizes that learning is enhanced when text and visual media are used together, rather than relying on text alone. In our project, we utilized both images and written instructions to deliver the same information. Including text with images will help users’ germane cognitive load, which refers to the mental processing in their working memory used to process helpful but unneeded information. Although adding images can help users understand the information more effectively, they are not necessary.

Text & Images

Use of both imagery and text promotes learning enhancement.

Hick’s Law

 Hick’s Law emphasizes that the more time and complexity there are, the longer it takes to make decisions. Therefore, we integrated only a few buttons on each page to help make decisions more efficiently. These buttons included the home button, the carousel, the front and back buttons, and the two tutorial buttons.

Simplification

Promotes quicker learning and decision time.

Final Prototype

For our final project, we developed an informational website with the goal to teach users how to create an Airbnb account and how to book an Airbnb. Our prototype was broken down into a pair of mini tutorials. “How to Create an Airbnb Account”, and “How to book an Airbnb”.

Conclusion

After completing this project, I realized that there is a lot more to the design of an interface other than just the aesthetics. There are a multitude of different ways we as designers can take into consideration how the mind and memory works to ensure that we are designing interfaces that manages the amount of cognitive load on a user. I look forward to keeping what I learned in mind when I move on to design more complex interfaces.