LifeSci Communications

This video highlights few pages of the project. Homepage followed by contact page, who we are, what we do, and a header which is common across other pages.

LifeSci Communications - website

Tech: HTML, CSS, SVG, Greensock, Wordpress, Elementor

I was responsible for the development of the entire website. I worked along with 5 members in the team which includes 1 project manager, 1 creative director, 1 director of web development, 1 art director, and a few copyright people to finalize the content.

Workflow & communications: Communication was done via zoom, slack, and email. The Art director used to provide the design files in .ai format. I used to analyse it we used to discuss and make plan for when we can complete it. I used to develop this and there was testing done by art director. At the end of the project testing was done by all the leaders in the company.

Client brief: Client had very attractive colourful design with line animation across the page on almost all pages. Per page the idea was as user scrolls texts and graphics should animate in along side the line animation. First home page was created they liked my work and asked me to create all the pages in the website which includes who we are, what we do, meet our team, contact us, join us, blog, client in the media, tag pages, disclaimer and privacy policy. Client wanted to use Elementor with Wordpress and GSAP library for animation. They did all the basic setup with data in Wordpress. Mobile designs were the minimize or same as the desktop view.

Few Interesting part of the project:

  1. Pages were divided into multiple sections and there was SVG line across the page along with graphics and text, aligning the line (line was not straight) for reach section making it responsive was challenging.
  2. Created Marquee with GSAP as we do not wanted to use plugin due to performance reasons.
  3. Join us page had complex animation and responsive layout to make.

Payment was done on hourly basis.