PXL responsive ecommerce site
Your intuitive one-stop shop for tech and creative gear.
A purpose built, elegant & intuitive one-stop electronics and creative gear shop for digital natives and tech heads.
My Role
-User research
-Initial to final UI design
-Prototyping & testing
-Marketing assets
Tools
Technology enthusiasts have many ecommerce options to choose from, but go-to sites like Amazon, B&H, and Best Buy have grown bloated, unwieldy, and confusing.
Coming onboard the project, the stakeholders had already identified that their clientele comprised the digital native and web-fluent class, concluding that the solution to be delivered would need to be sleek and easy enough to engage with meaningfully in the “in-between times” this group had:
...En route to work, between meetings, breaking for lunch...
ENTER PXL
A simple and elegant responsive website that caters to creatives and tech heads, utilizing smart and intuitive filtering options and intelligent data regarding the purchaser’s behavior to recommend products that delight and build consumer confidence.
COMPETITIVE ANALYSIS
I looked at the site flows and navigational elements on Amazon, B&H Photo and Video, Best Buy, the Apple Store, BlackMagic Designs and others to provide both initial inspiration and potential pain points. In addition, I worked with ChatGPT to determine what types of user interfaces were likely to solve the problems at hand, but also appeal to the targeted user group.
I found all of the above options to be unnecessarily complicated in terms of navigation and evident site mapping, due no doubt to the sheer vastness of their product catalogs and need to incorporate filtering and nav elements that were inclusive of every SKU.
Since PXL was to be a more focussed option for creatives and digital gear enthusiasts, I seized on the opportunity to simplify and customize the browsing and searching experience, removing unnecessary waste in the form of extraneous clicks, menu diving, and option selecting.
BRANDING, FLOW & DESIGN
Working with the project brief and stakeholders, I developed brand guidelines that outlined the company Mission Statement, the voice and tone of site copy, typography, the color palette and imagery style, and finally developed PXL’s iconic wordmark logo.
Using a Lean design practice, I sketched out a user flow that incorporated all of the primary jobs to be done and created the initial low fidelity interface outlines for second stage iteration and testing.
WIREFRAME EVOLUTION: LoFi - HiFi
FINAL DESIGN
Borrowing from the Apple Store’s aesthetic, high end photography retailers’ functionality, and many other sources of inspiration; all while taking user feedback and testing results to heart in order to produce the best product and experience possible for them; PXL’s final form was born.
RETROSPECTIVE
The streamlined UI and high-end visual direction landed well with users and stakeholders, validating early design hypotheses around simplicity and minimalism in ecommerce. Usability testing revealed strong engagement with the filtering system, though scalability became a concern as the product set grew.
The most valuable take away was how critical backend structure and smart defaults are to maintain a seamless experience as complexity increases. If revisiting this, I’d explore more dynamic, data-informed filtering methods and spend more time on animated microinteractions to further guide users through their journeys.
