Client
XtraCover
About the Project

XtraCover specializes in delivering a seamless experience for buying and selling electronic devices. Whether you want to sell your device for the best price or purchase your favorite gadgets at a fraction of their retail cost, XtraCover is your go-to destination. Our commitment to exceptional value and outstanding customer service makes us the ideal choice for all your electronic device needs.

My Role
  • Requirements gathering
  • Research & Analysis
  • Wireframe
  • UI Design & Prototyping
  • Web Development
  • Testing & staging
  • Client Training & Handover
Timeline
1. Requirements gathering 1 Week
2. Research & Analysis 1 Week
3. Wireframe 05 Days
4. UI Design 15 Days
5. Web Development 35 Days
6. User Testing 10 Days
7. Client Training 1 Week
Launch Date 22 Aug 2021
1. Requirements gathering

The client's requirement was to build a new e-commerce platform tailored for the buying and selling of mobile devices with the advantages of an online marketplace. We recommended leveraging Microsoft ASP.NET for its robust, scalable, and secure framework. The platform was designed with dual B2B and B2C capabilities, facilitating a comprehensive marketplace experience.

2. Research & Analysis

The decision to use Microsoft ASP.NET for the e-commerce platform was driven by the need for a scalable, secure solution that supports both B2B and B2C transactions. Market research highlighted growing demand for platforms that integrate bulk buying with consumer sales, particularly in the mobile device market. ASP.NET's robust security and scalability make it ideal for handling high transaction volumes and ensuring user data protection. The platform's comprehensive features, including advanced search, SEO optimization, and quality control, position it as a competitive, user-friendly marketplace.

3. Wireframe

Following the research report discussion, we moved on to planning the wireframe design. The wireframe was created to visually map out the proposed features, ensuring clarity and alignment with the design objectives. This approach was taken to streamline the design implementation process and address all key requirements, including advanced search, SEO optimization, and quality control, positioning the platform as a competitive and user-friendly marketplace.

4. UI Design

After carefully reviewing the client's feedback, the design was refined and finalized for the next phase. The finalized layout, including graphical assets and other key elements, was shared with the frontend developer via Figma. This approach ensured that every aspect of the design was accurately translated into the website’s frontend.

5. Web Development

Once the wireframes and UI style guide were approved, we initiated the UI design creation process. This involved converting the wireframes into high-fidelity designs while strictly following the established UI style guide. The emphasis was on crafting visually appealing layouts and seamlessly integrating the approved design elements to maintain consistency and coherence across the entire website.

6. User Testing

We conducted comprehensive website testing to ensure robust security and identify potential vulnerabilities, focusing on backend tests and reporting functionalities. The process involved evaluating user flows for smooth navigation and an optimal user experience, as well as assessing lead flow and other critical backend components. Emphasis was placed on protecting user data and privacy while ensuring that all features operated effectively and efficiently.

7. Client Training

Following the deployment process, we conducted thorough client training and handover sessions to ensure a smooth transition to website management. These sessions covered content updates, user engagement strategies, analytics interpretation, and basic troubleshooting. We also provided detailed documentation and support materials to assist the client in effectively managing and optimizing the website's performance after launch.

Screens