Rebranding Excercise + Key Takeways

featured image

For today’s post, I created a fictional redesign for the tech comapny Widevine, which I randomnly chose from a pool of business websites. Watch the video below to see the new design:

Compare this to the original, non-edited website:

screenshot of original widevine.com website design
If you were wondering, yes, I installed the Brave browser a few days ago.

If you are a bit lazy to find out the differences between the before-and-after of the website, I can point out some:

  • The gigantic logo sitting right below the menu was deleted. It served no purpose because there was already a small logo at the left of the logo.
  • The typeface was changed to Commissioner (a beautiful open-source font I mentioned in an earlier post on a similar topic). Not vital, but more of a personal preference, because I wanted to explore how hovering over buttons could emphasise the letters (via “flaring” of letters — which makes it more authoritative and stylish).
  • Blurring the disgusting client logos by default, unblurring them when the mouse hovers over the image. Do you get the joke? I wanted to blur these somewhat poorly designed logos to make it seem like they were censored.

So what did I learn today?

  1. CSS image filter rule which allows you to apply cool effects on photos: blur, saturate, brighten, to name a few.
  2. CSS min-width rule, which lets you define the minimum width of an element — especially useful for mobile pages
  3. The <hr> tag, a useful tag that separates two pieces of content.

Overall, I had good fun redesigning this website! I know that this isn’t the worst website ever, but as a first attempt, I think it is good enough. I hope to redesign websites which are worse in the future. Who knows? Maybe the owner will chance upon my post!

Featured photo by Ross Findon

Published by Thomas Rettig

Hi!

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

%d bloggers like this: