TL; DR - Contracted by Vaynermedia as lead UX to overhaul essie wireframe job: over a four week contract revised the main page structures and completely revised the interactive schema for mobile. Managed to lead discussions on the color picking UI / complex interaction to tame the build schedule and maintain technical focus
During a fast-paced contract with NYC's VAYNERMEDIA, the largest project by far on my desk was the redesign of Essie.com's ecommerce service. When I joined there were existing Wires which had signoff but the entire project was in mid-handover with a change of tech partners in the interim.
This meant that the project had a lot of revisions to go through in order to bring the signed off wires in line with what was being proposed.
The first thing I did was revise the Wireframes into a fresh Sketch Document both to familiarise myself with the project structure and to bring the entire project into InVision as visual prototypes rather than pure WFs. The second was to create a discussive piece to show the client how the mid and low levels of the site should be acting as landing pages and capturing user details as much as possible.
Prototype 01: first pass at feedback / desktop
This prototype addressed initial requests to revise original layouts for hover navigation etc.
Prototype 02: search and browse patterns on the site / desktop
Click on the successive highlighted option to see a classic search funnel
Prototype 02: interaction design behind palette selection / desktop
Same prototype shows how color selection is supposed to work inside the UI
After these initial discussions, we quickly realised that we needed to completely revise the navigation schema - so, based on the initial visual templates coming back from our design partners, I revised the entire set of WFs as an interactive mockup.
Basic changes in page structure such as persistent navigation and the creation of simpler stacks of information inside the site became a priority, and we reformatted the entire structure of the site based on this perception of navigation: the wirframes served as templates for invision mockups and we explored the UI as much as possible in the process:
Basic changes in page structure such as persistent navigation and the creation of simpler stacks of information inside the site became a priority, and we reformatted the entire structure of the site based on this perception of navigation: the wirframes served as templates for invision mockups and we explored the UI as much as possible in the process:
Desktop 01: revised navigation and cart process
This prototype was a revision top-to-bottom of both the structural / page template paradigm and the navigation
iPad 01: revised navigation and cart process
This prototype helped us confirm that desktop could shrink and remain workable via burger nav
Handset 00: UI testing for color picking
This prototype investigated how possible color nav was on smaller screens
Handset 01: UI tests for logic / groupings presentation
This prototype investigated what the best way to group color was
Handset 02: final navigation paradigm / production mockup
This is a final prototype to begin handover with the visual design partners
