I used this week’s design challenge to create a layout for a mobile boarding pass. — I wanted my boarding pass to be easy to use and helpful. I did this using several key features Placed bar code towards the top — usually the barcode is towards the bottom of the boarding pass, however, if you’re holding your phone out to someone to scan, the top…

A flight search tool that isn’t destination-based — I decided to create a flight search tool that catered to users who didn’t have a particular date or destination in mind, but rather, wanted to browse available flights narrowed down by other factors. I chose to feature four primary filters as well as a tucked away filter option to…

I used this week’s design challenge to learn about splash screens then create my own. — What is a splash screen? A splash screen is the first thing users see when they open an app. It serves as a loading screen before bringing the user to the landing page. It can also be used to collect login info. It is important that this screen represents your brand and product because even…

I used this week’s design challenge to create a 404 page. — First let’s quickly examine a default 404 error page: This page has a few usability issues. This page is a complete dead end. There are no buttons or links on the page to bring the user back to the site they started on. This forces the user to use the…

This week’s design challenge was to create a progress bar. I decided to make one that tracks a user’s progress through a book. — In my experience, on the spectrum of readers, there are two extremes: The Blackhole Readers (this includes me!): readers who start a book before bed and don’t stop until there’s suddenly no more pages left and the sun is up. All those hours vanished in a literary blackhole.

This week’s design challenge was to create a pagination component. — I wanted to create a pagination component with a clean font and simple, but fun colors. I was inspired by some of the more animated pagination examples online, so I decided to add in a hand that slides the page indicator as the user interacts with the component.

I used this week’s design challenge to create a set of dynamic buttons. — A primary CTA button is used to indicate the most likely or desired course of action. More visual weight is given to this button. The contrast might be greater, the colors might be bolder, etc. In short, the primary CTA is more readable. I decided to create a set of…

I used this week’s design challenge to create variations of loading animations for different use cases. — I created three loading animations for different uses. 1. Traditional progress bar for when the system wants to show progress and has the information to know how much progress as been made and how much is left (traditionally viewed as a percentage).

I used this week’s design challenge to create an image slider that displays products in a useful context for customers. — Buying furniture online is convenient, but it makes it harder to imagine the piece in a real room. In showrooms, pieces are set up in context — there’s other furniture so it feels like a real room. Showing a piece in context rather than just on a white background could…