Mockup to showcase the intended design and animation for the eCommerce software, for the Front End and Software Developers to use as a guide. The UI animation shows the initial entry into the app, how users can slide each row to look at products, and tapping on an item to see more information about it. Once viewing detail on a product, the user can slide horizontally to view additional photos, then choose the attributes and add to cart. Once they are done, they can close the window and continue shopping. Tapping on the menu button shows a store menu sliding in from the left.

Screenshot of OneShop app in action.

Initial Concept Design

Example of wireframe deliverable. Wireframes were sent to the client for approval before the design process was started.

Designs for pilot client

Main Screen Design

Filter Panel Design

Product Detail Design

Product Detail Design

Checkout Process Design

Main Screen and Category Menu Design. Belk opted for a fixed Instagram feed on the right side, scrollable vertically.

Product Detail Design

Touchscreen Shopping App

OneShop was concepted to be one of T1V’s (formerly T1Visions) flagship pieces of software, an easy and fun multitouch shopping experience. Multiple clients had expressed interest in a touchscreen shopping experience for in-store customers, and we aimed to provide a strong solution.

As Creative Director, I quickly came up with a concept to meet a rapid development schedule. The familiar grid view of product photo was used, but it was designed using separate rows of products that users can interact with. The user can also zoom into a 1 or 2 row view, or zoom out to view 4 rows at a time. Once the user taps a product, a detail window is displayed. Sales + Marketing budgeted for design work to be developed for our pitch. A retail client signed on using our initial concept, which remains the main foundation of OneShop today.

OneShop was used by multiple retail clients, including bebe, Neiman Marcus, Belk, Lowe’s and American Tea Room. Each time, the UI was designed with the client’s branding in mind. Each client requested specific tweaks for the overall interface. The largest difference was the product detail window, which would be redesigned to match the product information specifications. bebe in particular enjoyed the interface, which they requested to be worked into an iPad application for their sales associates.

We continued to iterate on the OneShop UI based upon long-term testing and user feedback. The Lowe’s version of OneShop combined the Category and Filter sidebars into one unified menu that slides out from the left side of the screen. bebe requested a version of OneShop to be used as a native iPad app.

Role
Creative Director, UX & UI Designer
Type
Interactive Touchscreen Application