AOP World
Responsive Landing page
Overview
AOP World's Landing Page was created to establish brand awareness and showcase their products to their B2B audience.
Details
Duration: 3 Weeks
Tools: Figma, Wix
Role: UX/UI Designer, Web Designer
Background
AOP World is a company that provides healthcare solutions, specifically for clean air, to different businesses in various industries. Acquiring this cutting-edge air purification technology from China, the company wanted to rebrand their products for international audiences in time for a major event they're sponsoring.
Problem
With the main products being from China, under a Chinese company, AOP World needs to rebrand and reposition themselves for the global market, with focus on B2B clients in hope of establishing partnerships. They also have a very limited amount of time to get ready for the first launch of their website.
Solution
-
Use a website builder to quickly launch an MVP (minimum viable product) site that showcases the brand's credibility and and provides all vital information about the product.
-
Present the complex technology and display potential usages to appeal for B2B clients
Emphatize
With the quick pacing of this project, I was in direct contact with the client via Whatsapp, who provided me with all the context, information, and media for the project.
Hi Ploypat, we need a landing page by the end of the month for an event!
Okay, I got you!
Great, here, let me give you some more context!
Context
- Event details and timeline
- My role and client's role
- Key expectations
- Challenges - Getting high quality images
- Because of the quick pacing of this project, it will be presented chronologically. 10 business days to work on the project before the first handoff
Overview
Background
​
Initial contact
- Request for meeting - exchanging contact details - quick explaination of timeline
​
​Week 1
- *Day 1: Meeting, introductions - establishing context, Initial research on landing pages - specifically on tech products
- *Day 2: Wireframe sketches, more understanding of the product
- Day 3-4: Wireframing
- *Day 5: Meeting - Wireframe presentation and client feedback, making edits
​
Week 2
- *Day 6: Establishing design system, First mock up on Figma
- Day 7-8: Start on Wix Creating the site
- Day 9: Work on the site, quick chat with client to update content
- Day 10: Final Presentation
​
Week 3
- Final edits, making sure the site was live
- Testing out forms
​
​
​
​
Persona
As the main goal of the Landing page is to provide information to potential business partners, our persona is quite clear.
Name: Rachael, Business Development Executive, Global brand
Industry: Home appliance
Age 38
Location: Singapore
​
Rachael had been working in the industry for over 15 years. She had recently been promoted to her current role, and is looking for new opportunities for the brand. She is attending the current event under the behalf of her company, who is one of the major sponsor of the event.
​
Needs and goals:
Seek out potential business partners, build relationships with them
To establish partnerships that can create opportunites for the brand
​
Frustrations:
The event is loud and not ideal for networking
Given the industry she's in, the technology can be complex and takes time to understand
​
​
​
"Research"
The client provided me with a lot of material to get to know the technology and the company I'm designing for. After going through the documents, slides, and discussions, I have simplified the complex technology as such:
Sketches:
landing pages and landing pages aimed for b2b
Define
With all the information provided, I'm ready within a few days to get started on the project
Challenge
- time limitations
​
Solution
- Create a landing page using website bulder that allows for further expansion
​
How Might We
Establish brand and show busniess opportunity to potential business partners at an event
Ideate
After spending the first couple of days on understanding the situation and research how best to approach this, I started sketching
Wireframe
This is your About section. Every website has a story and users want to hear yours. This is a great opportunity to give a full background on who you are and what your site has to offer. Double click on the text box to edit the content and add all the information you want to share.
Sections
Many iterations, depending on the information and media that the clients could find
Design
This is your About section. Every website has a story and users want to hear yours. This is a great opportunity to give a full background on who you are and what your site has to offer. Double click on the text box to edit the content and add all the information you want to share.
Logo & Identity
Given by client
Design System
Created to match the given brand identity
Prototype
This is your About section. Every website has a story and users want to hear yours. This is a great opportunity to give a full background on who you are and what your site has to offer. Double click on the text box to edit the content and add all the information you want to share.
Live Version
To be expanded into full website