Creative direction, design & strategy | 2016

Elysium Health

I collaborated with Elysium’s co-founder and leadership team to evolve their visual identity and shape it holistically across all creative outputs.

  • Worked closely with key stakeholders to translate business strategies and ambitions into a holistic visual identity — informing website, packaging, marketing initiatives.
  • Partnered with customer experience team, co-founders and scientists to improve site user experience (solving for customer pain points) while ensuring alignment with company priorities and business line objectives.
  • Designed and collaborated with front-end engineer to deliver a site built on a modular framework (no static pages) and a library of dynamic content modules; providing an agile and scalable site to the client, making material updates incremental and substantially lowering investment requirements needed to meet evolving business needs.
  • Built digital brand book to articulate clear guidelines to internal and external stakeholders.
  • Organized and art-directed still- and video-shoots for website and marketing collaterals.

Delivered a minimal and neutral foundation elevated by photography, refined hand drawn illustrations and guiding accent colors portraying a trustworthy, authentic and educational brand; scientific yet elegant.

Key priorities included bridging the gap between people and science, utilizing design and UI to clearly break down complex scientific research and data; and to shape a visual language that inspires people at any stage in life to invest in their health, and to benefit form the brand’s product, scientific research and lifestyle.

Designed the site with a modular framework; creating a comprehensive library of dynamic modules to be utilized for unlimited variations of pages, allowing the client to easily swap modules, re-order content, create new pages, and carry out A/B test to maximize performance and support business objectives.

Collaborated closely with front-end developer to strategically establish best solutions across design and engineering to create a seamless and effortless experience for the users, as well as maximize efficiencies internally across assets and content.

Credit
Front-end engineer: Rolando Garcia
Photography: Mosspark — Daeun Kim, Max Chin
Illustrations: Emma Nilsson


Project Process

Below is a summary of the project process.

1. Research and strategy
I worked closely with various stakeholder within the company to establish priorities, customer pain-points and objectives. I divided my time between research, site audit and in-person conversations with client to gather as much information as possible and to gain a holistic vision before moving onto the user-flow.

1. Example of site Audit | 2. Documentation of initial conversations and audit

2. Userflow
Created wireframes and site-maps. The aim was for the site re-design to roll out in three phases to allow for a smoother transition converting from old legacy onto new platform.

Top: Wireframes, desktop and mobile | Bottom: Sitemap across launch 1.5, 2.0 and 2.1

3. Visual exploration
Parallel to establishing the user-flow of the site, I worked on the visual identity for the brand.

Top: Art direction | Bottom: Layout and UI
Initial designs

4. Design
During design exploration I decided to design the site modular. I delivered individual modules for build, and collaborated with the front-end developer to establish patterns and rules.

Desktop and Mobile designs (not final) style-guide and modules examples

5. Photography and Illustration
I worked with Mosspark studio on site photography. I organized and art directed the shoot, and assisted on retouching.
I brought on Emma, who created our beautiful illustrations based on my briefs.

6. Development and management
I worked closely with engineers and head of content to align on priorities, and I managed the process through to site launch. I established process for tracking progress across content, assets and build to streamline workflow.

7. Post launch
After initial launch we monitored conversation and gained customer feedback; informing smaller iterations, A/B testing and prioritization of planned features for 2.0 and 2.1 launch.

8. Visual guidelines / brandbook
Using Dropbox paper I built a comprehensive brand library for internal and external stakeholder to insure consistency across all creative output going forward.