Isotonix Landing Site





I requested that I have the chance to assess what we were using for product landing pages, and preemptively design a better experience that could be presented to Senior Management. The conclusion was to not only deliver a clean, customer friendly design, but also have sufficient data to qualify its production.
I took the initiative and used a user centered approach to drive the site's requirements.
Click the images above to open the HTML prototype.
We do keep metrics on the current site's performance that I was able to request. Using this, I determined that most of the existing sections and navigation paths could be eliminated. Still, I felt it prudent to document what I was starting from.
Click the images above to view the original (current) landing page design.
Before doing any design work, I met with the Isotonix Product Manager for some background information on different customers. Only two profiles came up as "buying" customers, with a third who would likely frequent the site. To document this, I created a User Persona document. Although the website users I profiled didn't fit into a category of possibly having disabilities, the customer research I had showed that many Isotonix users do. Given that, I decided it was best to take an extra detail step to ensure the site complied with Section 508 standards.
Click the images to download the 3-page PDF.
User flow diagram "Mary" | User flow diagram "Viviana"
To keep Management AND Marketing aware of how I expected these users to interact with the site, I clearly mapped their likely task directions with User Flow diagrams. I found having this on hand helped to keep scope creep to a minimum.
Home page wire frame | Sub page wire frame
Wireframes were produced to get sign off on the visual and interactive requirements. A requirement of the overall project was to reduce the clutter and confusion of the current landing pages. As such, the subpages would have one and only one layout.
Alternate layout wire frame | Alternate layout visual design
Before committing to one layout, I designed one more wireframe that had a more "concise" product showcase feel. I really lobbied for this one as I felt it more closely matched the idea of what you would expect from a landing page. I went so far as to make a visual design pass on it after hours as well. Unfortunately, this one was not selected to move forward to the prototype phase. Can't win 'em all I guess.
