Redesign landing page
The challenge: Redesign my first product and event landing page.
The challenge: Redesign my first product and event landing page.
The first time I designed an interface was for a product/ programme in December 2020/ January 2021, and it was slightly more than a year ago. Many people, including myself, would think that a landing page is the same as a product page or any regular website page — however, they are so much more. I started without prior knowledge on designing an interface or knowing the difference between a typical product page and a landing page.
In my case, I chose to focus on the click-through landing page. The challenge is to redesign the first-ever interface I designed, and the primary purpose is to improve & hone my UI skills. So what I did was I deconstructed the UI, which I first did, planned out which information is essential and how I should lay them out and then restructured it with new visual design, layout, typography and colour.
First part: Product Landing Page
In my case, I chose to focus on the click-through landing page. The challenge is to redesign the first-ever interface I designed, and the primary purpose is to improve & hone my UI skills. So what I did was I deconstructed the UI, which I first did, planned out which information is essential and how I should lay them out and then restructured it with new visual design, layout, typography and colour.
First part: Product Landing Page
What does a landing page include? Design-wise, they are similar to classic landing pages; they have conversion-centric elements, like a magnetic headline, benefit-oriented copy, hero images, social proof and more, to compel visitors to click the CTA button.
The hero section is the first thing that users will see when visiting a website, and it is important that it needs to be clearly communicated, including the value proposition; what we offer and what are the values? Usually, it also contains an image, CTA, heading, subheading, social proof etc.
There are 5 types of website landing pages:
• Squeeze page
• Long-form landing page
• Click-through landing page
• Product details page
• Video landing page
There is absolutely no perfect landing page design that works for every product or service. Hence, it would be ideal to consider A/B testing to see which performs better with two different landing page styles.
Second part: Event Landing Page
There are 2 types of event landing pages:
• Event registration landing page — they are designed to drive signups and reservations
• Lead gen landing page — they are designed to build interest and capture contact information
• Event registration landing page — they are designed to drive signups and reservations
• Lead gen landing page — they are designed to build interest and capture contact information
To create an event landing is straightforward, as long as we ensure the attendees are clear with the details by including all the elements into the landing page, like the organiser, subject, time, location, host/ speaker, CTA and social media sharing.
Next, the form/ CTA is also important. It is unnecessary to display the form on the landing page; another option is to create a CTA button that leads to a form. A better form can get user’s data without the user being burdened by the task; always use labels, a single CTA, leverage placeholders and avoid z-pattern as straight vertical lines boost scannability. These are ideal for users to scan through and create a nice symmetric effect.
Disclaimer: Although I am employed by Training Vision Institute (TVI). However, do note that all views, thoughts, and writings expressed in this challenge/ case study/ redesign are my own and do not reflect the opinions of TVI or anyone else. I am doing this solely to hone my skills.
