Your personality

Project: Personality Test Landing Page - Overview

October 14, 2014|Project: Personality Test Landing Page

There is a huge problem with how we choose (or simply fall into) a career path. How did you choose your current career? Most of us don’t make a conscious effort or set aside any time to figure it out and make sure we get it right. Other than a day in high school I know I didn’t.

The Personality Test

I have plans to fix this. To make it easy (or at least easier!) and fun to answer that all important question, “What am I going to be when I grow up?”. The personality test is a part of this plan.

The personality tests falls under the category of understanding ourselves - our natural strengths and natural weak areas. After all, we will be much more successful and happy when we use our strengths in our jobs and not our weaknesses.

Likely Changes to the Personality Test

This small project - creating a landing page for the personality test - will probably change. It might even change a great deal. In the future it may be removed all together and incorporated into another landing page that introduces the whole process of how to begin understanding ourselves.

I also have plans to change the way people identify their personality from guided self-selecting to automated (personality test) to a combination. So, this part of the application will likely change in the future as well.

Even though this page and the personality test itself will likely change it is still probably the single most important page in the personality test. On this page a user will determine whether or not to explore their personality or not. If they don’t, none of the other pages matter at all. So, even though it will probably change or get incorporated into another page we still have to do this page right. It is still very important.

The Project Steps to Creating the Landing Page

Here are the steps of the project as I see it right now:

  1. Decide on the message in its simplest form
  2. Roughly outline the other information (content, message, main points) that should be included on the page
  3. Explore different layouts/designs (breadth approach)
  4. Narrow down design to 1-3 for header
  5. Wireframe/sketch page
  6. Finalize color palette (I’ll be using the majorfinder colors so that’s why I’ll just be finalizing)
  7. Design in photoshop if anything is unclear (done in step 5)
  8. Create the page (using HTML and CSS)

This is my best guess at how this will go. I always remain flexible though so this may change.

The Next Step (Step 1)

In this step I will walk you through how I determine the main message of a page. This is probably the hardest and most important step.

Want to level up your CSS skills?

Sign up below to receive a CSS tip each week as well as access to my courses and articles as they become available.

I won't send you spam, promise. If it ever feels that way you can unsubscribe at any time.

Sign Up For Free


Sign In