THE DESIGN
Before the Redesign
This is how it looks like before I worked on it. It is pretty straightforward; users download it, they activate it, and it shows up whenever they open a new browser – it includes the motivational quote in two languages, time, and date.
The Logo
This is the logo. I wanted it to be different, so I tried to freehand it – and I came up with this accidentally. I was scribbling different ways to write the letter ‘B’ on Adobe Draw and this came up, but with rounded corners. When I moved it to Adobe Illustrator, I took the pen tool and tried to mimic what I did by hand; I started with hard lines and thought of just making the corners round after I draw the whole thing, but then I saw how it looks like with hard lines and I just decided to keep it. The only thing the client requested was that she wanted the color teal, so that’s what I used.
The Planning
After the Redesign
This is how it looks like after the redesign (however, this is still in the development stage, but still available for download from Google’s Chrome Web Store). It works a little bit differently from the original. It now shows more elements than before; I added temperature, location, and the ability to generate another motivation through the “motivate me” button in case the users want another motivation – they can now do it without refreshing the page. It now also has a Settings and About section located in the bottom right corner – the users can do a few things in the Settings; they can turn off the image (ode to the old design), change the time format, and change the temperature units. I also thought that not all images would be work with the text, so I added a black overlay, so no matter how busy the image is, the text would always be visible.
Samples with other images:
Sample if the imagery is turned-off on the settings:
