Logo David Ronchaud
mackbook pro container iPhone 6S plus container
Branding
ui / ux design
Front-end developer
Print design

Complete redesign of welfare platform

person
Customer

Lifemotiv

update
Date

january - april 2016

important_devices
Project result

lifemotiv.net

Description

Lifemotiv is the platform of well-being in France. I was in collaboration with a back end developer to make this MVP (Minimum Valuable Product).
I started to make a competitive design benchmark. I've included the digital content sales platform in this benchmark. I proposed several graphic tracks. Based on the material design guidlines, I realized the models of the main screens (Home, Search page, Author page, parcours presentation page, content consumption pages, etc.) in three screen sizes: desktop, tablet and mobile. To do this, of course, I retouched each image to fit with the atmosphere of the website. I clipped some images to correspond with their position on the website.
Then, I've started the front-end development on Symfony2. So, I used Twig (the rendering template of Symfony2 as PHP), Sass (with Gulp to concat to css) and jQuery to animate or create some interactive elements.

Lifemotiv design screen home page

Hight resolution screen of the home page for desktop. As you can see, this page has been improved since this hight resolution screen, see the improvements on the website: lifemotiv.net.

Lifemotiv product page

I've created many jQuery fonction to animation the website and improve the user experience. For example, on this page (above this text), the sidebar with CTA (call to action) follow the scroll to stay visible (they stop their progression when they arrived to a full width section: here, these sections are "avis" and "nous vous recommandons également"). Maybe you can understand better if you visite the website online: lifemotiv.net/partner-yoga.

Lifemotiv signup page

Design and front-end development of all secondary pages (signup / signin / checkout / password lost / CGU / Helps / my purchases / user profile / etc.)

Lifemotiv search page

Lifemotiv responsive

This platform is full responsive and workable with all browser (until IE 9).