100 Day design challenge
I've been seeing a lot of fellow designers post their progress for this challenge and I was intrigued to give it a try. The premise is you subscribe and Daily UI sends you an email a day with a very high level prompt. It is then our job to interpret and carry out the task.
I wanted to give myself a bigger challenge to think through (if time allows) on certain challenges to create animations of the anticipated functionality & flow. Find more details here of the 100 Day Design Challenge. Each design you see below is done within 1- 1.5 hours, and I tried to not use Pinterest or the internet to borrow ideas during ideation. #DailyUI #100dayChallenge
+ Visual Designer
+ UI Designs + animation
+ Illustrator (AI)
001. LOGIN FORM
The task was to create a login flow and I wanted to tie it into context. I'm always looking for new recipes and I wanted to revamp the "Allrecipes.com" login/ register pages.
So far so good... that wasn't so bad.
002. CC CHECKOUT
The task was to create a credit card checkout flow. Today I wanted to challenge myself to use a different set of iconography, new color schemes and typography. Since my last design was desktop, I thought I'd change it up with mobile for this challenge. (Click to enlarge)
It's funny how we do so much online shopping, yet when I had to start this design without Pinterest or internet help, I couldn't remember all the form fields that were required for an online transaction.
003. LANDING PAGE
The task was to a landing page above the fold. This is by far my favorite design of all because of it's minimalism and simplicity. (click to enlarge)
Honestly, this was the hardest one so far. It's hard for me to only think about designing a homepage "above the fold" and not consider the navigational structure or what other content exists on this page. I still condensed some of the navigation from their existing site, but would be a worthwhile future project to dig further and re-design their entire navigation structure.
The task was to create a calculator... Similar to Day #2's, it took me a second to remember the keys on a calculator, whether it's digital or a physical calculator. (click to enlarge)
I wanted to explore with different fonts, colors and styles. This time, I approached using rounded shapes as my button styles.
005. APP ICON
The task was to create an app icon. My inspiration came from my love for food, especially tacos. (Click image to enlarge)
Today's task was actually a lot of fun. I played around with different overlays and opacities, went through a lot of trial and error with colors before I was satisfied with how it looks. (Still not 100% yet) I would definitely love to come back to this assignment to flush out more pages of the app! But I definitely spent the most time on this compared to the others.
006. USER PROFILE
The task was to create a user profile and I decided to go with the mobile version.
I channeled one of my favorite TV shows, Parks and Recreation and created a profile for the famous Leslie Knope.
The task was to create a settings page and I wanted to take a stab at revising the Spotify account settings. I also explored different typography and used rounder button styles.
No thoughts on this task. It wasn't as challenging at the other ones.
008. 404 error
The task was to create a 404 page and I was inspired by my favorite books, Harry Potter. I've always been an avid HP fan, so I wanted to use one of the quotes from the books for this.
This was a lot of fun! I couldn't decide which is my favorite yet between these. I was also thinking of doing one more in the future, with an illustration of The Room of Requirements. " If you have to ask, you will never know. If you know, you need only ask."
009. Music Player
The task was to create a music player and I was thinking of a more engaging way to showcase the song playing at the time through clean icons and strong visual imagery.
This song has been on repeat for me for a very long time. Ed Sheeran has a lot of catchy songs and I love his music and lyrics. This was overall a very fun task because I used different colors and went for a more clean and minimal look.
010. Social Share
The task was to create a social share concept. Since I haven't played with the apple watch designs just yet, I wanted to use this time to explore that.
I can't believe it's only the 10th day! Some of the tasks has been a lot of fun, while others, I really struggled with both the concepting, but also finding time to create.
011. Flash Messages
The task was to create a flash message to include a success and an error message. I wanted to explore using a different cartoon-y style.
This was overall a pretty fun one, mostly because I tried to challenge myself with more of illustrations.
012. Ecommerce Page (1 product)
The task was to create single product e-commerce page and I decided to use the product I've been recently thinking about purchasing. The embroidered details are to die for!
This was a really fun and different approach. I might come explore this a bit further later this weekend to flush out a full product detail page.
The task was a messaging platform of some sort and I wanted to add to the previous day's task. So I ended up creating a chatbot as a part of the e-commerce experience to address customer questions while going through the purchase funnel.
I briefly had a project while at GMR to work with chatbots and it was actually a lot of fun. I'd love to explore designing UX for chatbots in the future and would definitely love to flush this out as a future self initiative project.
014. Countdown Timer
The task was to create a countdown timer and I decided to use this opportunity to design a landing page for a side project I'm working on with two other friends.
I definitely will be coming back to animate this task and continue to tweak the site.
015. On/Off Toggle
The task was to create an on/off toggle and I wanted to do something that showcases simple geometric shapes.
I'll have to admit I took a break from #14 for a couple of weeks because things got chaotic at work. But getting back into this is nice and I forgot how much I miss visual design.
016. Popup Modal
The task was to create a pop up modal.
After some brief time off, I picked up this 100 day design challenge again with Day #16, which is a pop up modal asking users for live feedback on a new feature launch.
The task was to a create a receipt page and seeing that it was a day after Black Friday, I thought this was fitting.
I purchased the new Google Pixel 3 phone over black friday with their deals and thought it was fitting to showcase a different receipt UI.
The task was to create a dashboard and I decided to showcase analytics on top ROI measurements we measure when doing digital work.
There are so many ways we can approach dashboard designs, but I went with a more minimal and simple approach.
Today’s task is to create a Leaderboard and I decided to switch it to mobile view compared to the previous day.
Gamifying a simple task is always fun and gives users an incentive to want to participate. I created a simple mobile leadership board that shows the top winner, with monthly and yearly views.
020. Location Tracker
The task was to a location tracker. Iconography is from flaticons.com
I wanted to showcase a location tracker that ties back to day #17 to track the status of my Google Pixel 3 phone. Needless to say, Fedex delivery is the worst.
021. Home Monitoring
The task was to create a home monitoring dashboard.
This was very fun and pushed me to do a more minimal design than I’m used to. I was thinking back to the thermometer app that we have at home and what are the key elements they show.
022. Search Hint
The task was to create a search hint so I created an autosuggest search dropdown.
I actually just did something similar for a client project so this was by far the easiest one. I challenged myself by focusing more on the hierarchy of content and utilized simple blue linear UI to keep it simple.
The task was an on-boarding screen and I went through a 4 step on-boarding flow.
I love thinking through on-boarding scenarios, especially ones with cool animations and micro-interactions that engages the user. I’m currently thinking through an app solution related to Travel, so I wanted to create an on-boarding experience that relates to that.
The task was to create a ticketing UI and I decided to do a flight ticket using clean and flat design.
This was actually a lot of fun and I’d love to come back and think through a bit more of the animation, as well as adjust the barcode.
025. TV UI
The task was to create a UI for a TV application.
In anticipation for season 8 of Game of Thrones, I created a TV application UI to show my excitement, utilizing typography and photography as the main focal point.
The task was to create a subscription UI.
I can’t say I was very excited to do this challenge… subscriptions are rarely fun. But I might come back to this and make it more interesting.
The task was to create a dropdown and I decided to redo the navigation dropdown/ mega menu for a website I recently visited.
This was a lot of fun rethinking through their dropdown navigation. It’s a bit more clean and engaging for users.
028. Contact Us
The task was to create a Contact Us page or form field and I wanted to challenge myself by using a different font and UI style.
I’m noticing that I love sans serif fonts and linear iconography…