LANDING PAGE DESIGN & DEVELOP

Project
Preheat

In online marketing, the general goal of a landing
page is to convert site visitors into sales or leads.

Process improvement

Automation, Landing Pages, Webinars, Email
Marketing and more-in one platform

v 1.0

After instapage charges by traffic, we started to use powerful webflow to build LP.

v 2.0

As more and more companies use shopify for overseas sales. we have encountered some minor troubles. but the emergence of shogun has solved the problem

v 3.0

Design Standards

Ul Style Guide Section Preview

Establishing UI specifications and setting the section layout is conducive to fast and standardized development of pages.

Page Content

Including solo image, 3-type icons and 3-columns. these modules must be responsive design on desktop and mobile after the design is completed.

Hero (Desktop/ Mobile)

The difference in structure and layout results In a responsive design Tor the page lero, which is adapted to the desktop and mobile terminals respectively.

CTA (Call to action) &Footer

Call to action is a marketing term for any design to prompt an immediate response or encourage an immediate sale. Footer includes company information and copyrights.

About

Based on the company's years of experience in Landing page design, I have summarized a set of landing page design standards. This design standard includes UI style guide, commonly used panel styles, desktop and mobile adaptation, form HTML, Javastrip insertion.

Apply to

This set of design standards applies to webflow and shogun. These two tools need to manually set their html and css to gradually build the entire page, and use different css settings to maintain the responsive design of desktop and mobile terminals.

Gallery

When landing page is published

we will continue to do these things

S P E E D U P

Optimize SEO to
speed up page loading

I N N O V A T I O N

Optimize design and text,
more appropriate and attractive

S H A R E

Share friend
Win prize

Thanks for watching!

BACK TO UX & ANALYSE