L.F. Markey
E-commerce for L.F. Markey a contemporary women's clothing brand
Revamping L.F. Markey's E-commerce
What I Did
User Research
UX/UI Design
Visual Identity
Prototype & Testing
Concept Project
L.F. Markey, founded by Louise Markey in 2008, is a contemporary women's clothing brand celebrated for its functional and stylish designs inspired by workwear and utility clothing. With a focus on clean lines, utilitarian silhouettes, and bold colors, the brand's aesthetic is characterized by oversized proportions, boxy shapes, and playful details such as large pockets and contrasting stitching.
This project aims to revamp L.F. Markey's e-commerce website, addressing issues related to the homepage's loading and lack of information. The primary objective is to create a visually appealing and functional UI design that aligns with the brand's distinctive style. By optimizing the user experience, maintaining brand consistency, and enhancing the shopping journey, the redesigned e-commerce platform will provide customers with an improved experience, leading to higher engagement and increased sales for the brand.
A Comprehensive Analysis of L.F. Markey's Current E-commerce Platform
During my comprehensive analysis of L.F. Markey's current e-commerce platform, I uncovered several noteworthy findings that shed light on areas requiring improvement to enhance the overall user experience. The following issues were observed:
Error Loading on the Homepage
1.
It became evident that the homepage suffers from loading issues, resulting in a less-than-ideal first impression and a subpar browsing experience. Resolving these loading issues is crucial to ensure a seamless and engaging entry point for users.
Lack of Hierarchy in Product Details
2.
The product details section lacks a clear hierarchy. This lack of structure can confuse users and make it difficult for them to locate specific details they are looking for. Implementing a structured hierarchy will greatly improve the readability and usability of the product information.
3-Column Layout on Product Page
3.
The current product page employs a 3-column layout, which can be visually overwhelming for users. This layout may result in content overload, making it challenging for users to focus on essential product details. Exploring alternative layouts or reorganizing the content can significantly enhance the user's ability to absorb product information effectively.
Unfamiliar Placement of Selection Buttons
4.
The placement of selection buttons appears unfamiliar. It is crucial to ensure that these interactive elements are intuitively placed within the user interface, providing a seamless and familiar browsing experience.
Overview of the website's structure and navigation
The site map provided a high-level overview of the website's structure and navigation. The site map design depicted a logical structure, with clear categorization and a straightforward flow from the homepage to various sections and subcategories. This structure aimed to streamline the user's journey, making it easier to navigate through the website and find desired products.
Design Principles for a Stylish and Functional Experience
These design principles, tailored to L.F. Markey's unique style and brand identity, will guide the e-commerce redesign process, ensuring a visually appealing, functional, and cohesive website that resonates with the brand's target audience.
The Wireframing Journey for L.F. Markey's E-commerce Redesign
I apply the design principles to create wireframes that harmonize with the desired user experience and reflect L.F. Markey's brand identity. By iteratively refining and testing these wireframes, I ensure that they strike the perfect balance between aesthetics and functionality. Throughout the process, I aim to align the wireframes with the target audience's preferences and create a visually appealing e-commerce platform that delivers an exceptional user experience.
Revitalizing Branding and Visual Language for a Bold and Captivating Identity
I decided to upgrade L.F. Markey's brand identity and visual language by incorporating bold and playful typography. I believe that by infusing the brand with bold and playful typography, we can inject a sense of energy, personality, and modernity into L.F. Markey's identity. The typography will serve as a visual statement, capturing attention and making a lasting impression on customers.
Overall, upgrading the brand identity and visual language will successfully reinforce L.F. Markey's distinctiveness, modernize its image, and provide a fresh and vibrant online presence.
Inviting Exploration
By including banners showcasing the principal categories, users can quickly identify and navigate to their desired product categories. This improves usability and allows for a seamless browsing experience. Additionally, featuring seasonal collections on the home page helps to highlight new and trending items, capturing the attention of users and encouraging them to explore the latest offerings.
Furthermore, the addition of a blog section on the home page serves multiple purposes. It not only provides valuable content and insights to users but also acts as a platform for L.F. Markey to share its brand story, fashion tips, and industry trends. This interactive element fosters engagement, establishes a sense of community, and further encourages users to delve deeper into the website.
Designing a Playful and Vibrant Navigation Experience
A colorful and playful menu for L.F. Markey aims to create a delightful and engaging user experience. By incorporating vibrant colors and playful design elements, the menu becomes an eye-catching and interactive element that adds an extra layer of visual interest and enhances the overall brand experience.
Optimizing User Experience on PLP with Clear Navigation and Quick Add Feature
The design of LF Markey's product listing page focuses on enhancing the user experience by implementing key features. The category navigation is positioned at the top to maximize space and improve accessibility. The information display is simplified with a clear hierarchy, allowing users to easily scan products. A quick add feature is included, enabling users to add items to their cart directly from the category page. These design elements work together to create a user-friendly, efficient, streamlined browsing experience.
A Dynamic and Informative PDP
LF Markey's product detail page design offers a captivating and informative user experience. It features a full-screen horizontal scroll that allows users to view product images in detail. A fixed block of product information ensures essential details are always visible with a clear hierarchy. Additionally, product suggestions at the end of the scroll invite users to explore related items, encouraging further engagement and discovery. This design approach creates an immersive and interactive experience, facilitating informed decision-making while enticing users to explore more from LF Markey's collection.
LF Markey's Mobile-Optimized E-commerce Adaptation
The responsive design optimizes the interface for various screen sizes, ensuring easy navigation and accessibility. Key elements are strategically placed to prioritize important information, and images are optimized for mobile without compromising quality. Streamlined checkout processes and touch-friendly interactions enhance the mobile experience. This mobile adaptation ensures that users can effortlessly browse, explore, and make purchases, maintaining a consistent and convenient experience across platforms.
