Lumi helps e-commerce companies produce custom packaging and handle supply chain logistics, with the goal of making custom manufacturing as scalable as the web.

Lumi provides services to users that are consumer brands in need of packaging, as well as packaging suppliers & manufacturers. To communicate to these multiple user demographics a marketing site was designed to provide tailored content to both buyers and suppliers.

Initial design focus was to standardize the app experience by establishing a modular UI component library for both the consumer brand-facing dashboard and the manufacturer-facing dashboard. For the buyer's app, users needed to be able to easily create & purchase any custom packaging needs.

Consumer brand users needed to be able to select and specify their packaging requirements and designs, so the app interface was designed to assist users in making informed decisions with high-density data about packaging products, flow into the cart & payment funnel, and view essential information about quantity & price.

To assist consumer brands in comparing across a marketplace of many manufacturers, an interface was created for displaying rich data regarding packaging specifications, quote comparisons and lead times.

From the manufacturer's perspective, they needed to be able to market themselves to prospective consumer brands. So an app UI to create unique manufacturer profiles with detailed information about their products & services and a scorecard rating was designed.

The manufacturer dashboard utilizes the same UI component library to standardize visual cohesiveness, but with a UX focus on the manufacturer's need to respond to consumer brand requests, providing quotes, feedback, and status updates.

A modular UI component library example for a LabeledField input. By designing and utilizing a reusable modular component library & establishing a design system, each app targeted for a specific user demographic maintained visual branding consistency and user experience.

UI/UX, Development

Product designer and developer of a modular UI component library to maintain cohesiveness across Lumi's various app user interfaces and visual design. Senior front-end engineer contributing to the migration of Lumi's web applications into a strongly-typed functional programming language, on top of a React framework.

View UI component library

Lumi

Smarty unifies task management & calendar scheduling into one clean application. Powered with a natural language processing interface, users can enter text to create tasks, events, scheduling links and more.

To communicate the capabilities of Smarty's suite of scheduling & task management tools, a marketing site was designed with animated visual content & graphics to demonstrate how Smarty can help users.

After user testing and research, the sign-up experience was designed to let first-time users explore the app interface without requiring any login or form information. Thus lowering the barrier of entry for new users to experience Smarty's feature set, as well as onboard to the app through engagement with the platform itself.

Powered by a natural language processing interface, the Smarty app lets users build content through a purely textual UI, such as the / command to create Tasks, Notes, Events and Scheduling Links. Both calendar events and tasks list were designed to be unified into one clean view, allowing users to more efficiently use their time without context switching between multiple applications.

Based on user research of existing systems & methodologies Smarty's target demographic use to handle managing tasks & scheduling events, the app was designed to emphasize a clean minimal UI so users can focus on what's important. To add contextual information when required, users can simply type as they would in a physical notebook or calendar, triggering natural language driven actions.

Smarty handles task management and scheduling for users, and the AI powered auto-scheduling feature allows users to avoid conflicts and prioritize their most important tasks. The UI was designed to help automate actions for users but still let them have discrete control.

Users can also view their scheduled Tasks & Events in a calendar UI view, and create shareable Scheduling Links. Free times are auto-detected, and reminders go out automatically; with the app design streamlined to help users take the work out of connecting with others, so they can focus on the activity at hand itself not scheduling it.

UI/UX

Lead product designer, creating the foundational core interface for Smarty's responsive desktop & mobile app, and Chrome extension. Working closely with the CEO and engineering team, created the foundational UI component library and app interfaces, as well as conducted user research & testing.

Smarty AI

The Arrivals is a NYC based fashion line focusing on classic, architecturally-inspired garments crafted to last a lifetime and exclusively available online.

As a high-end NYC fashion line, The Arrivals required bi-weekly interactive campaigns, supporting multiple product launches. Creating new campaign designs in regular sprint intervals required standardization of the Arrival's branded visual design system and prioritizing high impact & fast turn over of designs.

The interactive e-commerce store was designed & developed to display the rich array of products in multiple-styles, with a focus on the consumer user navigation experience by creating sorting filters based on best selling, price or inventory.

Product detail pages needed to display rich imagery detailing the product's aesthetic as well as information regarding fit, materials, and allowing users to receive contextual information before making a purchase commitment. As well as designed to provide suggestions of similar product styles to leverage user interest. 

As an e-commerce brand, The Arrivals needed mobile-first designs so users could view and purchase products across any device type, and a responsive website UX was designed & developed.

With an emphasis on its architectural roots, a structural & textured UI was created focusing on visually displaying compelling imagery and video content.

Lead product designer & front-end engineer responsible for the creation and implementation of interface designs for a responsive, cross-platform e-commerce web app. Translating marketing needs and promotions into a highly polished user experience, as well as designing and developing bi-weekly interactive campaigns, supported multiple product launches, and improved the site interface based on A/B studies.

The Arrivals

SUITED is a biannual fashion and art publication with a singular mission in mind: to celebrate those who have found what they are well-suited for.

As a print publication, translating the SUITED experience online focused on designing a UI that highlights rich imagery and featured content. As content needed to be regularly updated, a custom CMS driven template was created on top of the SquareSpace developer platform.

Because SUITED's initial experience was their printed content, the site was designed to highlight previous issues and leverage site visits into opportunities for users to order hard copies.

SUITED magazine's aesthetic is minimal, black & white and high-end. The site was designed to emphasize the physical experience into a fashion and art focused digital site.

Mobile accessibility was of importance so users could experience the site across a variety of devices. The site was designed and developed mobile-first.

With the mobile device UX in mind, the mobile app version of the site prioritized the rich imagery and content to be viewed as easily on phones as desktops.

Principle UI/UX designer and front-end engineer for the premier launch of the online edition SUITED magazine. Created a customized CMS driven template design built on top of the SquareSpace developer platform. Collaborated one-on-one with the Creative Director & Editor-in-Chief to translate the print publication brand into a digital experience.

SUITED Magazine

Data visualization of language patterns and lyrical analysis of top Billboard charting songs over the 20th century.

What do popular song lyrics say about cultural moods, concerns and political issues of different times? To answer this question and because no database of this information existed at the time, a Python web scraping script was developed to pull lyrics from the top Billboard charts since its inception in the early 1900's. Using a Java based IDE and natural language processing, frequencies of noun entities (such as "I" and "you"), as well as common verbs that express relationships between those entities (such as "love", or "hate") were visualized.

With this data visualization, topical patterns over time became evident as song lyrics from different decades reveal societal patterns and trending topics.

Frequency of keywords were used to weight their size (more frequent use of a noun phrase resulted in a larger font size), and bézier curves to visualization semantic linkages between different keyword entities.

Visual design, Development

Creative director & developer of a data visualization examining language patterns in musical lyrics over time, revealing cultural trends and moods of different time periods as expressed in top-charting songs. Presented as large format digital images and print posters.

Data Visualization

Onomie is a direct-to-consumer cosmetics brand that is a cross between skincare and makeup. Created to simplify beauty by combining clinically-validated skincare formulas with advanced makeup technology.

Onomie is an e-commerce brand using scientific backing for its skincare and makeup products. To emphasize the power of Onomie's skincare products on the site, interactive before & after UI sliders and visual illustrations were used to demonstrate the quality of product ingredients and effect on skin improvement.

As an e-commerce site, the experience was designed mobile-first, so users could experience and purchase Onomie products on a variety of devices.

Lead product designer & front-end engineer for Onomie to help it stand out from a competitive market by featuring interactive trials and science backed beauty products.

Onomie

Tom Tom Magazine is a quarterly print magazine and website based out of New York City. It is the only magazine in the world that is dedicated to female drummers.

As a print publication Tom Tom Magazine needed a digital site that reflected their focus on music related content.

Additionally an e-commerce site was needed for users to purchase branded products, and was built by creating a custom Shopify template with CMS integration. Allowing team members to easily track inventory and sales related data.

Responsive mobile-first designs were implemented to create a seamless experience on across a variety of devices for users.

As well as the mobile designs for the e-commerce site experience.

Lead designer & developer for Tom Tom's e-commerce platform to leverage site visits into opportunities to sell the publication or goods related to the brand. Using the Shopify CMS a custom responsive template theme was designed and developed for the Tom Tom store.

Tom Tom Magazine

A proposal for a new Willard Park Community Center (located in Berkeley, CA) inspired by the action word “emergence” and the concept of subtractive openness “to carve”— designed with the intention of creating a building that is an extension of the ground, and is carved open to external air and light.

The Willard Park proposal is an architectural exploration of how an existing public space could be utilized to better serve the community while respecting the natual landscape.

Designed to communicate a multi-dimensional exploration of how layered designs would operate cohesively. The foundational earthen mound informs the basis of the design. The building’s structure is extended from the topography and the interior courtyard carved out. The main body of the structure is surrounded by the mounded earth. The building is created by a balance between curvature and angular cuts.

Detailed layouts were created to show how users would utilize the space; providing public restrooms, office spaces for staff and community spaces for events and classes.

A top-level view of a green roof design integrated into the natural landscape that also provides additional usable space for community members to explore and use for recreational purposes.

The green roof design integrates into the natural landscape of the park and creates a seamless extension, the open-air corridor and rooms are made of planked concrete as an affordable and durable option that represents organic materials; with steel guard railings built along the walkable green roof around the courtyard for safety. And large glass windows allow external views into the interior, and provide light to all the rooms.

The courtyard plays with natural materiality: stone, wood, earthen supports for a vertical garden, as well as contain interior trees and small garden areas. The vertical gardens in the courtyard reinforce the connection of the structure as emergent from the earth.

Visual design, Architecture

Visual and architectural designer of a 3D spatial proposal in Rhino, as well as isometric and blueprint designs to communicate the vision for a reimagined community center in Willard Park. Using Photoshop, visuals were created to demonstrate how community members would experience the space.

Lumi

Lumi helps e-commerce companies produce custom packaging and handle supply chain logistics, with the goal of making custom manufacturing as scalable as the web.

Lumi provides services to users that are consumer brands in need of packaging, as well as packaging suppliers & manufacturers. To communicate to these multiple user demographics a marketing site was designed to provide tailored content to both buyers and suppliers.

Initial design focus was to standardize the app experience by establishing a modular UI component library for both the consumer brand-facing dashboard and the manufacturer-facing dashboard. For the buyer's app, users needed to be able to easily create & purchase any custom packaging needs.

To assist consumer brands in comparing across a marketplace of many manufacturers, an interface was created for displaying rich data regarding packaging specifications, quote comparisons and lead times.

From the manufacturer's perspective, they needed to be able to market themselves to prospective consumer brands. So an app UI to create unique manufacturer profiles with detailed information about their products & services and a scorecard rating was designed.

The manufacturer dashboard utilizes the same UI component library to standardize visual cohesiveness, but with a UX focus on the manufacturer's need to respond to consumer brand requests, providing quotes, feedback, and status updates.

A modular UI component library example for a LabeledField input. By designing and utilizing a reusable modular component library & establishing a design system, each app targeted for a specific user demographic maintained visual branding consistency and user experience.

Visit the site

View UI component library

Product Design

UI Component Design

Development

Work

Skills

About

Contact