desktop_mockupcastlightx_mockup
browser mockup

Creative Brief: Create a blog page for upcoming educational content all while staying on brand.

Role: Lead Designer

Process: This project was all about organizing a collection of educational articles on eyesight wellness. Besides reviewing Castlight’s current brand and product, I looked for cues and inspiration in news agencies and entertainment apps like iTunes and Netflix—these products also face the challenge of organizing information. My preliminary work included a flowchart, a moodboard, and numerous wireframes.  I built numerous mockups in Sketch. For this project I worked alongside a content marketer, the head of UX, and a developer.

Key takeaway: Keep it simple! Early on key stakeholders wanted this project to include three main sections (topic page, landing page, article page). Midway through the project, I realized this structure made the user experience more complicated and more confusing, so I made the decision to simplify the hierarchy into two sections (topic section and article). I wish I had more foresight earlier in the project to see this and make the necessary adjustments sooner.

Process Shots:

chart

Flowchart showing how potential users will access the site (shown in green)

concepts

Wireframes for different approaches to the Topic Page

mobile concepts

Wireframes for the mobile version of the topic page

2nd Wireframe for the article pages