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.
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.
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.
Design and front-end development of all secondary pages (signup / signin / checkout / password lost / CGU / Helps / my purchases / user profile / etc.)
This platform is full responsive and workable with all browser (until IE 9).