Big Bear
The idea is to create a simple high-functioning application so the user can easily maneuver while on the slopes or at home. Let's jump right into it!.
Big Bear Lake is a small city in southern California. There is obviously a lake, but it is also known for it’s Big Bear Mountain ski resort. The community is small and friendly with multiple gift shops, boutiques, and restaurants in the village. It is a wonderful place for a family vacation. This leads us to my case study. My family, and I are avid snow boarders and skiers, so I downloaded the app. After downloading it I only used it twice since retrieving information became a challenge, and I thought this would be a great opportunity to redesign the app.
Role:
Product Designer
User Research, Interaction, Visual design, Prototyping & Testing
2021-Present
The Problems
Aesthetic and Usability
One of the major problems is usability. Even though this app looks aesthetically pleasing, and attractive it does not mean the app is going to meet the users needs.
It's about creating a positive emotional response, but once we jumped into user testing with a task, it becomes very clear that just because it looks better doesn’t mean it works better. Even though it is visually stimulating, there are certain actions we can take to make it more appealing.
The Original Design
The first thing I noticed about the homepage is that the Big Bear Icon isn’t functioning. This made me think of Fitt’s Law. Fitt’s Law is a focus on movement and can accurately predict the amount of time taken to move to-and-from an icon or target. When thinking of Fitt’s Law with the size of the screen, I wanted to focus on “thumb zones”. If the user is in the act of Skiing this will be very important. They most likely will be wearing thick gloves which make holding the phone difficult in the first place.
Note to reader:
I am going to use an iPhone layout
Dimensions- 2.98"W X 5.94"H
The iPhone is designed so the users thumbs can access the whole screen.
The "Plus" is for emergency’s only. Even though it is a “medical” plus sign. It isn’t a common icon that everyone knows. I feel like this symbol is more commonly used in Europe than the United States.This is a great feature but definitely needs to be updated with a new icon. The placement is great since it is the hardest place to reach a user that is right-handed and only needs to be used in emergencies.
Metaphors & Placement of Icons
The Icon seems to be slightly outdated, and there are a lot of choices that could be in the"hamburger" menu. Hick's Law can be useful in this situation. All of these icons are increasing the complexity of the users choices. Many options can confuse a person, and make the process more complicated than it needs to be. It can ultimately drive visitors away.
If you notice on the homepage the Big Bear icon is taking up the majority of the screen; approximately 60%. The icon does not function.
My solution would be to remove that icon from the center of the screen, scale it down, and replace the pass-holder button, or place it in the
center-top space. This gives more space for the other icons on the homepage.
The Health and Safety icon is about health and safety with COVID-19. When the icon is pressed: Instead of providing all pertinent information it prompts you to another list of icons, some of which you cannot access from the homepage. This list is given to you. every time you press any icon. It is confusing to say the least since after you push a button, you expect the feature to do what the icon is presenting. After scrolling down, it gives you a brief description, but more hyper-links to try to find information. You are now going deeper into the rabbit hole.
Wireframe
For my wireframe I used Adobe XD. I tried to give the application a more sophisticated simplistic look, and bring it up to-date with the design. I took away the unnecessary icons, and pages. I also added a major new feature of being able to buy a ski ticket from the mobile application (app). Not only purchasing, but also making it scan-able. Of course there will need to be a lot more iterations that need to be done to this wireframe before the project goes live.
Next Steps
The released version of the app and needs lots of user testing. However, there are still improvements that can be made. A customer should be able to flow through the app smoothly and easily when they are on and off the slopes. I made a high-fidelity mock up as well in Adobe XD to trouble shoot some of the design issues, but again would be subject to updates after multiple user testing sessions.
Below is the final product!