Design System
We created a design system for code and UI consistency and efficiency. The development team is mostly back-end developers. The design system enables more developers to do front-end development by copying and pasting reusable code components.
We also upgraded to the latest bootstrap version. We used the design system to guide refactoring old markup and markup that didn't follow best practices.
The same design patterns are used in Figma.
UI/UX
- Design
- Development lead
- Front-end development
Annuity Product Calculator
Advanced Calculator
Enables finacial professionals to test and visualize investment potentials using multiple input options.
UI/UX
- Design
- User Testing
Grocery E-Commerce Home Page
Updated Aisles Online Home Page
Improvements increased:
- Time on the page by 5.5x
- Items added to the cart on the home page by 5x
The design improvements include:
- Personalization for each shopper
- Swimlanes that can be ordered by a CMS
- More options to display sponsored products
- More options for advertisements
UI/UX
- Design
- Baseline remote user tests of the current home page
- Competitive analysis
Grocery Search Page
Updated Search Results Page
- Improved product cards:
- Four-wide instead of five wide to improve scannability
- Shorter height to improve scannability
- Larger images
- Improved deal indicators
- Much improved filter design and interactions
- More options to display sponsored products
- More options for advertisements
UI/UX
- Design
- Baseline remote user tests of the current filter interaction
- Filter interaction user tests
- Product card interaction remote user tests
Grocery Cart Page
Updated Cart Page
- Improved organization for scannability
- Improved sidebar hierarchy and interations
- Added upsell opportunities
UI/UX
- Design
- Baseline in-person user tests of the current cart page
- In-person user tests of the new design
Grocery Substitutions Page
New Grocery Substitutions Page
- Improved with a simple on/off choice
- Simplified information and instructions
- Simplified interactions for picking individual substitutions
UI/UX
The old user flow had a disjointed experience where a user would pick if they wanted to allow and/or pick specific substitutions on a separate page that included vehicle information. This lead to a broken user mental model and complaints.
The new design allows the casual shopper to easily turn substitutions on or off. It also allows power shoppers to be very granular with their substitution choices. It has reduced complaints significantly.
- Design
- Multiple in-person user test sessions
- Iterative design based on tests
UX Process
We created a working process based off of Marty Cagan's triad system. It started with a working agreement with product owners and tech leads that improves collaboration and communication. The process includes:
- Problem statement creation
- Ideation and competitive analysis
- Story mapping
The process has a regular cadence of meetings to create accountability. We refined the system over time. It improved efficiency, quality of work and relationships.
The Drop App
UI/UX
- Design
- Front-end development
Web App for a Medical Company's Call Center
This web app creates efficiencies and has expanded capabilities for the client. It creates trackable data to find bottlenecks and growth opportunities. It is designed to be very scalable. It uses:
- Video conferencing
- Automated tasks
- HIPAA compliant security
- Functionaly specific to many different user types
UI/UX
- Design
- User tests
- Front-end development
- Managed back-end developers
- Client relationship management
Construction Field Web App
An iOS and Android app that construction managers use in the field. They order items from their warehouse or create purchase orders. That data is used for inventory management and fed into accounting. It is simple to use and functional on a construction site, including saving data when cellular or data connections are not available and sending once they are.
UI/UX
- Design
- User tests
- Front-end development
- Managed back-end developers
- Client relationship management
Complex Online Form
A web app that makes filing for T19 funding easier for patients to fill out in a stressful time. The app saves progress because the form will most likely not be filled out in one sitting. It has intuative progess tracking for the user throughout.
UI/UX
- Design
- Front-end development
- Managed back-end developers
Lowe's Creative Ideas iOS and Android App
We published custom content daily to hundreds of thousands of users.
UI/UX
- Create and manage content workflow and schedules
- Design
- Manage digital content editors and designers
- Front-end development
- User tests
Scheduling Web App
A web app used to schedule field techs for construction projects. It's simple and meets the client's needs and budget. It features:
- Days scheduled vs quoted work
- Custom generated reports
- Automated notifications
- Data collection from field techs to check quoting accuracy and efficiency
UI/UX
- Design
- Front-end development
- Managed back-end developers
Parents.com Website
I was on the web dev team that created Meredith's first responsive website. It raised unique visits by 25% and mobile usage by 47%, which translates to millions of more site visits.
Front-end Development
- Created custom functionality for individual web apps
- Worked in an agile development team
- Communicated with business analysis to meet and update requirements
- User tests
Call Center Web App
Design for the call center web app used to service many different types of clients and an incredibly high call volume.
UI/UX
- UI/UX design incorporating corporate standards and existing iconography
- User tests