100-day UI design challenges. Topics are from http://www.dailyui.co/
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
001 Sign Up
002 Credit Card Payment
003 Landing Page (Above the fold)
004 Digital Calculator
005 App Icon
006 User Profile
007 Settings
008 404 Error Page
009 Music Player
010 Social Share
011 Flash Message (Success:Error)
012 Single Product
013 Direct Messaging
014 Countdown Timer
015 On:Off Switch
016 Popup:Overlay
017 Email Receipt
018 Analytics Chart
019 Leaderboard
020 Location Tracker
021 Home Monitoring Dashboard
022 Search Hints
023 Onboarding
024 Boarding Pass
025 TV App
026 Subscribe
027 Dropdown
.DS_Store
README.md

README.md

100 Days of UI

027 Dropdown

Coming soon.

026 Subscribe

Imagine: Jamie works busy city life. She hardly has time to cook dinner these days. Going out every night costs a lot, she discovered that, sadly, as she jots down numbers for recent months’ spendings on food. $15, $20, $17… it doesn’t seem much per meal, but it’s a lot when all adds up.

She starts researching cheaper and convenient meal solutions. Instant ramen noodles? $2 per bag, but no, too unhealthy. Meal ingredient delivery services? No, too much work. Cooked dinner delivery service? Hmm. How much is it? $9.99. Recipes look good and healthy. A 30% off deal for first week’s subscription. Not bad.

Jamie wants to give it a shot. She inputs her credit card, reviews dinner choices and ready to subscribe to the service.

026 Subscribe

025 TV App

Imagine: Dan is a busy young professional. He spends 12 hours working outside home every weekday. He has been wanting to have a regular work out schedule. The nearest gym is about 7 miles away, and he doesn’t want to drive far to a gym after he gets back home. He started looking for ways he could exercise at home, and eventually decided to purchase a dancing game disk for his Xbox. He’s not an avid dancer, but he would love to try it out. After all, this will make him move around and sweat.

Dan turns on the game console, and selects the dance game. After a few introduction screens, he landed on mode selection. Via Kinetic, his outline is captured and displayed on the screen. He lifts his hand and that gets captured as well. It automatically lands on the Easy mode. “Let’s take it slow for this first time.” He holds the hand still for 3 seconds, and the Easy mode is activated. He’s going to have his first dance.

025 TV App

024 Boarding Pass

Imagine: Jamie Smith and Winnie Lam are about to travel for business from Los Angeles, California to Maui, Hawaii. They booked their flights with Swift Flights, which is famous for its swift services. They arrived at the airport, printed out their Swift boarding passes from the kiosk. There’s about 30 minutes after they got through the checkpoint, so they went to a cafe and worked a bit.

Jamie took the picture as they put their boarding passes on the table.

024 Boarding Pass

023 Onboarding

Imagine: Jamie just got her poodle puppy Bella a few days ago from a breeder. She’s going to take Bella to the vet for a thorough check the very next day, and get her first batch of vaccination in a week. Bella doesn’t seem to like the new dog food she prepared. She wants to note all these down. She found the Pet Diary app from the iOS app store. She opens the app, scans through the onboarding screens, learning that this is where she can track Bella’s important matters. She decides to give it a try.

023 Onboarding

022 Search Hints

022 Search Hints

021 Home Monitoring Dashboard

021 Home Monitoring Dashboard

020 Location Tracker

020 Location Tracker

019 Leaderboard

019 Leaderboard

018 Analytics Chart

018 Analytics Chart

017 Email Receipt

017 Email Receipt

016 Popup/Overlay

016 Popup/Overlay

015 On/Off Switch

015 On/Off Switch

014 Countdown Timer

014 Countdown Timer

013 Direct Messaging

013 Direct Messaging

012 Single Product

012 Single Product

011 Flash Message (Success/Error)

011 Flash Message (Success/Error)

010 Social Share

010 Social Share

009 Music Player

009 Music Player

008 404 Error Page

008 404 Error Page

007 Settings

007 Settings

006 User Profile

006 User Profile

005 App Icon

005 App Icon

004 Digital Calculator

004 Digital Calculator 004 Digital Calculator

003 Landing Page (Above the fold)

003 Landing Page (Above the fold)

002 Credit Card Payment

002 Credit Card Payment

001 Sign Up

001 Sign Up