UX/UI Project: Right 2 Bear – Firearms Safety & Education

ux/ui design project

Overview

This is an ongoing UX project for a firearms safety company based in Riverside, CA. The first phase of the project included redesigning the landing page. The second phase will be the rest of the site. 

Role
user interviews | user flows | wireframing | prototyping | UX writer

Tools
Photoshop

Project

Challenge
The client wants their customers to have an informative experience when learning about the offered services. By building trust through their content, customers of all skill levels can register and efficiently sign-up for firearms safety/education courses. 
Problem
The current site is outdated and haphazardly thrown together. The current class schedule is one long, uncategorized list, adding to customer (and client) frustrations when trying to sign up. Also, the current interface is packed with content and widgets, creating a distracting, inefficient experience.
Approach
By keeping the users (the customers and the owners) in mind, implementing a minimal, dark UI, reorganizing the site navigation, and restructuring site content will give customers a smoother sign-up experience when they sign up for classes and digest essential information.

Lo-Fi Wireframes

I created lo-fi mockups for each existing section using a 12-column grid, keeping in mind good design principles, such as white space, visual hierarchy and color contrast. As a business, I understand the need to market and advertise their services/products, and created space for social media.

Final High-Fidelity Mockups

After a few iterations, the design’s dark UI balanced customers’ needs and the client’s expectations. A few touches such as a “back to top” button was added, since the home page was lengthy. Overall, this design introduced organization to all the essential information, making it more palatable for potential and current customers. The buttons and hover states indicated actions, and more padding all around was added to organize content.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

This site uses Akismet to reduce spam. Learn how your comment data is processed.