Lenstore (Store Locator Design)
Project Overview
The Client:
A global online contact lens and eye-care retailer, aiming to target both new customers and those with a repeat contact lenses prescription.
A global online contact lens and eye-care retailer, aiming to target both new customers and those with a repeat contact lenses prescription.
Brief & Goals:
To design an interactive store locator that works across multiple devices and make it easier for users to book an eye test with Vision Express (partnership), to make eye tests and contact lens check-ups available to everyone.
To design an interactive store locator that works across multiple devices and make it easier for users to book an eye test with Vision Express (partnership), to make eye tests and contact lens check-ups available to everyone.
Software Used:
XD, Illustrator
XD, Illustrator
What I Did:
• Research
• Sketches & Wireframes
• Interface Design
• Icons
• Interactive Prototyping
Technical Limitations:
To save time for developers and deliver a project with a quick turnaround, the design needed to implement Google Map API as well as use native functionality whenever possible. I also researched into the best practices to liaise with the tech team to check feasibility.
To save time for developers and deliver a project with a quick turnaround, the design needed to implement Google Map API as well as use native functionality whenever possible. I also researched into the best practices to liaise with the tech team to check feasibility.
Desktop Designs
Full-width map outside the container for greater navigation and visibility. The sidebar is thin to let users see more of the map. Max. of 10 stores shown to reduce clutter for greater usability.
Mobile Designs
Uses native functionality i.e. phone calling, directions + search current location for faster load speed and easy learnability. When a marker is selected, the relevant location info. underneath opens to provide more info.
Tablet Designs
Portrait Mode:
Store finder widget is full width, listing max. 1 result in the list to save space and allow greater navigation across the map.
Store finder widget is full width, listing max. 1 result in the list to save space and allow greater navigation across the map.
Landscape:
Widget panel is left aligned and narrow to make map markers easier to tap.
Widget panel is left aligned and narrow to make map markers easier to tap.
