About LEYEFE
LEYEFE is a service that provides a new way for photographers of varying skill levels to deliver and sell social and event photos on a pay-per-photo model. It enables affordable photography to be sent to anyone instantly and anywhere.
My Role
User Research, Wireframing, UI Design & Specification, Usability Test
Challenge
After successfully launching their iOS app with a new design and an innovative photo sharing feature, LEYEFE wanted to rebrand themselves with a new marketing website.
Result
I designed a responsive website that is compatible with desktop, mobile phones, and tablets through an iterative design process.
This website became a new hub to introduce the LEYEFE app and its vision to change the photography market.
With the newly redesigned website, The number of users increased, and the company signed multiple partnerships with local and international partners.
Background

LEYEFE Website before the Redesign

The existing website was developed in 2016 with 2 simple paragraphs about the product concept. As the number of app users increases after the initial app launch, the website also had lots of new visitors but didn't have any helpful information on it​​​​​​​.
User Research
Ideally, I would have been able to do some research into actual user data in details, such as what people want to learn about the product and what kind of information they want to see. However, I was unable to conduct formal user research due to the circumstances.

As an alternative, I interviewed 10 people in my network to understand what consumers expect to see on the company website before they download or purchase the new product. I could identify 3 key findings:

◼ What is it?
The user wants to learn about the product and how it works before deciding to download the app. They also visit the website to make sure they are not downloading a harmful product (e.g., scamming apps).

◼ How is it different from other products?
When trying out a new product, the user compares the product with other products in the market that they have used or using. The website is a perfect opportunity to differentiate the product from its competitors. I decided to focus on providing clear content, explaining the unique value points of the LEYEFE app and its potential to change the photography .market

◼ How it can benefit me?
The user won’t use our product if there is no benefit to them, so I decided to specify how our product could benefit our target users, photographers..
Planning
I shared the user interviews' findings with the stakeholders to identify the intersection between the business goals and user needs.
Since LEYEFE only had a minimum amount of information to share publicly, I decided to design a single-page website that guides the visitor through a singular flow with simple navigation.
When creating this flow, I incorporated the findings from the research and focused on including the following information:
◼ Brief introduction of the product
◼ The app's unique key features
◼ How the app works
◼ How the product benefits the user?
◼ Provide valuable resources for the user

Sketch
To come up with the best solution to deliver content. I generated many ideas by sketching on a piece of paper. I discussed with the marketing team to agree upon each section's content and generated multiple ideas based on the content.
I considered the content's responsive layout from the early level since lots of users would access the website via mobile device right before they download the app to their devices.
Mid-fi Wireframes
After sketching, I created mid-fidelity (mid-fi) wireframes to map out the interface's shell, its screens, and basic information architecture. 
I also analyzed the best way to layout the contents of the responsive website before implementing any visual design or brand identity. I shared this with the stakeholders, marketing team, and developers to plan and validate the page layout and finalize the content for high fidelity wireframes, the next step.
Hi-fi Wireframes
To give the stakeholders a better idea of how the product will look and feel before the development cycle, I created high-fidelity (hi-fi) wireframes with both visual and textual context.
After finalizing the design and content with the team, I built an interactive prototype to validate my idea through usability testing.
Validation & Iteration
I conducted the usability test to identify problems within my design. Because I was the only designer in this project, I wanted to reduce the risk of building the wrong product through this. 
Because the website by itself is pretty simple, the task scenario was developed to test the navigation of the site to make sure that the user can find what they need.
Changing the Navigation​​​​​​​
Initially I came up with an idea to have a side navigation bar on the desktop website. However, I discovered that people felt more comfortable with the top sticky navigation because it was more common on the web and easier to understand the interaction at a glance.
Outcome
By including the stakeholders in the design process from the beginning, the project's direction became clear. I was able to understand the constraints and business goals of this new marketing website. Although it was a simple website with very minimum information, the launching of this new marketing website meant a new beginning for the company.
After launching this website, the company was able to sign multiple partnerships with local communities and businesses. The number of users increased as the product/company's online presence increased with the new marketing website.

Other Projects...

Back to Top