The 100 Days of UI Challenge

Week 1 of 20

Hi there, long time viewer first time caller. I’ve been working as a designer (and more recently, developer) for a few years. In this series of posts I will be highlighting some of my experiences through designing something non-work related everyday for 100 days.

The Challenge

Long story short, a friend recently introduced me to the 100 Day of UI challenge by Daily UI. The idea was interesting, and I’ve been looking for a reason to blog something design related. So, once per week for the next 20 weeks I’ll be posting my latest challenge updates. These posts will vary in content, but are guaranteed to include:

1. Five daily UI designs from the week
2. A small write up into the design and thought process
3. Maybe (depending on what kind of prompts I receive) some case study style blogging

Additional Conditionals

I’ve taken it upon myself to up the ante on the challenge a bit, so I’ve set some conditions under which I’ll design. I’m interested in growing some skills with this thing and adding these restrictions will force me to flex some creativity muscles.

Disclaimer: I may change these conditions as the challenge evolves. An hour may not be realistic depending on the prompts that come in, or perhaps I’ll want to maximize a free trial for some new software or library or something — I dunno, but if anything changes I’ll note it in my weekly blog!

Time

I’m limiting myself to one hour per day, per design. I must start and complete the days project within 1 hour of opening the design prompt email (not including making mockups, writing posts, etc — just the design).

You can check out my design from day one below to see how the time limit can sneak up. I want to get the most out of this challenge, and deadlines aren’t my strength. So far it’s gone well, but who knows what kind of prompts I’ll receive in the coming days.

Tools

I can only design within Sketch (which I would likely do anyway, because Sketch rules). I’m currently five days deep and haven’t had the need for paper yet, but I think that is also an acceptable medium. However, drawing time is included in my one hour time limit, so it will likely be a luxury if I feel like I have the time.

Publishing

Finally, the DailyUI encourages those who undertake the challenge to publish their work. I intend to do that on here in blog form, and possibly on another site like Behance (Although I would really prefer to use Dribbble if anyone has an invite for me!).

If I end up posting to other platforms I’ll link them here. My reasoning for the blog is two fold: a) I’ve been looking for a way to start blogging my experiences freelancing in web design (I blog photos here — check it out!) and; b) If I’m designing with blogging in mind, I will (hopefully) be more thoughtful.

Wrap Up

Ok, so for you TL;DR people:

• I’m doing the 100 days of UI challenge
• I’m imposing additional restrictions on myself:
• The design must be complete within one hour of opening the email prompt
• The designs must be made exclusively in Sketch (and maybe paper and pencil)
• The results must be published

So, without further adieu — here are my posts for the week.

#001 — Sign Up Sheet

Ok, day one. I’ll be honest, the clock caught up with me on this one. I spent way too long doing research and looking for inspiration. I ended up with fifteen minutes to throw this thing together. As a result, it’s not the nicest looking, but at least it’s functional!

Simple but effective —I totally ran out of time on this

#002 — Checkout App

I was feeling pretty defeated from yesterday. I worked to optimize my research process a bit and managed to give myself some more time for the actual design. I simply searched “#002" on dribbble and behance for inspiration, rather than doing general google searches and falling into that time vortex.

This store in nice because they sell individual shoes

#003 — Landing Page

This was a rush job — I’ll admit I didn’t give it the full hour like I was supposed to (this is where publishing the results comes back to bite me!). However, (I’m writing this retrospectively — hindsight is 20/20) today’s time crunch did help me in one major way — I set a 5 minute timer for my research to avoid time wasting. Revolutionary development here. Going to employ it on every sprint I do from now on.

#004 — Calculator

This was actually way harder than I was expecting it to be — it’s tough to make an original calculator. I didn’t succeed in my attempt. The color palette is novel (I swiped it off a pickle jar I saw at the grocery store), but I definitely didn’t reinvent the wheel on the design. I was actually down to the wire on designing this. I had to rush to beat the clock after rearranging every element 200 times.

I should also note that I sent this to my phone with sketch mirror after I finished and the button layout is not user friendly. Key takeaway: don’t change something that works well just for the sake of design. Every basic calculator I’ve ever seen has a vertical column of operators on the right side for a reason.

This color palette was inspired by a pickle jar I saw at the grocery store

#005 — App Icon

I thought of this on the fly, and it’s good to know the left side of my brain is still in tact after all the planning and restrictions of this challenge. I’m pretty happy with how the icon turned out.

I couldn’t find a decent mockup template for an app icon. If anyone has any suggestions let me know! For now, the ol’ two tone gradient will have to do.

Copywriting as we speak

Well, the first week flew by. I’ve integrated the hour per day into my schedule pretty well, so hopefully I can keep up the momentum! Stay tuned for next week, where I hopefully don’t embarrass myself as much as the reinvention of the white box!

Thanks for reading! Follow me to stay updated on the progress of the challenge. Also, consider recommending this page to your followers and friends — more eyes on me = more pressure to produce quality work.