Landing Page Redesign

Balsamiq | HTML | CSS | Bootstrap | Github

CONCEPT

This was a recruitment project I did for a web designer position at the tech startup Tenfold. They said I could use this project in my portfolio. This was the final round in the interview process and they asked me to create a working redesign of their landing page using their brand assets. I was asked to:

  1. Design a mockup in Photoshop
  2. Create working browser demo from the design mockup

I really like their current website which is what made this a good assignment. How do I iterate on an already solid design?  I noticed on Tenfold's landing page they had lots of information and was pretty busy, very formal and business looking, and I wasn't exactly sure what their product was until I navigated to a few other pages and gathered more information.

Armed with these thoughts I decided to 1. Create a simpler landing page that conveyed their product quickly and easily 2. Use their brighter blue color to create a friendly, fun, and welcoming design.

WIREFRAME

DESKTOP MOCKUP

MOBILE MOCKUP

PROTOTYPE

DISCUSSION

My main goal for the redesign was simplification and to do that I created a full width clearly segmented home page with a smaller number of sections and text than their live site. After studying their product I realized it could be difficult to understand the jargon explaining the product so I wanted to clearly show in diagrams what it was and also put the "Request a Demo" feature front and center, understanding the product is much easier to grasp in action. 

The landing page has a large email form to request a demo. I found this form on many pages of the Tenfold website and assumed this was one of the most important aspect of the site so I made sure this was the first thing people saw.  In the first section I decided to include a graphic that clearly shows what their product is because I wanted to help the user understand this quickly.

I then chose the following 3 sections to show the most important information and would ultimately lead the user to the most important pages on the site. These sections are 1. Find your system (does your system work with Tenfold) 2. Diagram and information that shows the app structure (Directs to a demo) 3. Client referrals (directs to testimonials) 4. What sets Tenfold apart (Directs to Demo)

CONCLUSION

This project definitely stretched me creatively but was a welcome challenge. I knew I didn't want to do something opposite to the Tenfold current website just for the sake of being different but rather decided to iterate on their design. I gave it a more fun tech startup and less business look and simplified the amount and direction of information. I was on a deadline and implemented most of what I wanted to do but definitely looked at this as a proof of concept rather than a fully working website. Ultimately i was very happy with the way it turned out.

Critique

I didn't end up getting the job and was not given any critiques on my project. If I had to critique myself I would say the fun bright look might not fit with the market they are trying to capture, large corporate businesses. I also might have oversimplified to the point it looked too bare. It might look a bit too similar to their current design to the point that it seems like I copied too much of what they have already. This was purposeful though because, like I said above, I didn't want to reinvent the wheel but rather iterate on it. There also wasn't anything flashy like animations or customer services popup windows.