Huddle
When
December 2019
my role
UI Design
Summary
Huddle is designed to help you find a room for you and/or your team at a moments notice.
Finding a spot to get your team together can be stressful, especially during the day when other meetings are taking place. But with Huddle, plug in your requirements, and it will get to work on finding a room that meeds your needs.
This project was completed as part of the UI Design course with DesignLab.

IDEATION

To begin coming up with an idea for a potential design, I needed to understand the needs of my user and their goals.
To help in gaining this insight, I created a user story to help sketch ideas for what this web application might look like.

I thought, "As a user trying to reserve a room, what details would be important to me?"
Someone who is hosting a meeting would probably need to know the following: 

• The number of people attending the meeting
• Finding a room for a specific date and time
• Location of the room
• Method of communicating event to attendees

With my user established, I began defining the essential functions that my user would need to:

• Search for a room
• Filter the search results based on their needs
• Book a room

I needed to view how my user would go about doing this so I created a user flow to identify the functions of the pages that should be available based on the users task and goal.
Next, I created the wireframes for the web version of this app. Although my focus was only the UI, the wireframes would aid in making sure the composition of the site was user friendly. This would also give me an idea of how to arrange the components of the site.

VISUAL DESIGN

After completing my wireframes, I started working on a style guide. Throughout this course, I was developing my understanding of color, typography, and UI patterns to be able to create an aesthetically appealing and effective design,

My biggest challenge was recognizing consistency in patterns, such as the spacing between paragraphs and their headings, or with buttons,
This style guide was used for that purpose: to create a consistent experience that would also define the brand of Huddle.
With the style guide set, I returned to my wireframes to begin adding those elements of color and typography first.
The style guide make it extremely efficient to design the application.
I was able to evaluate the effectiveness of the overall composition and modify it quickly with the style guide.
I often ran into issues of contrast, and instead of spending time looking for a substitute color, I had an array of colors prepared to select from.
With the website version completed, I now moved my focus to the mobile version of the app.
My style guide included elements for the mobile version, so again, I didn't spend too much time thinking of the sizes for the elements like the logo or icons.
My time was consumed by arranging it for an optimal mobile experience.
I had to consider my users environment to establish a context to determine which functions would be available and to prioritize the content.

CONCLUSION

By learning how color, typography, composition, and other UI elements affect the users understanding of a design, it provided me the focus in designing an application that is consistent and effective.
I think further study of UI patterns (and practice) will only help me to continue develop my skills as a UI designer.
My goal is to not only deliver an effective product, but an aesthetically pleasing one, too.
Liked this project?
Send me an e-mail so we can start working together.
Contact