Michael Duve UX/UI Designer

UXdesign view ux skill set

UIdevelopment view ui skill set

Lowe's Product App Research, UI, IxD, Strategy

Lowe's Product App

view prototype

The Products App, essential for associates to help customers, became cluttered with untested features, burying key information. For an effective redesign, we needed to deeply understand user engagement and task workflows.

All information in this case study is my own and does not necessarily reflect the views of Lowe's

Objective

The Products App, initially designed to replace a kiosk-based system, introduced mobility to stores and became essential for scanning and looking up items. With 25-30 million weekly views, it’s the most used tool in Store Support. In 2021, leadership aimed to overhaul it into a digital liaison, enhancing the user experience, building a scalable interface, and raising inventory awareness to improve store visibility.

Team and Role

As the senior designer on the project, I worked with an agile development team to retool the Products App based on leadership’s vision. I also reported to our UX Lead, who made sure we were hitting high level goals and OKRs , and assisted by an Associate Designer and Content Strategist who helped to conduct research, workshops, design sprints, and user testing. Lastly, I presented findings to UX and business partners to validate changes, garner support, and ensure alignment.

Users

Products app is used by all store associates (Red Vest and MST) although certain tasks are role based and only accessible by supervisors and managers.

The Challenge

Product Details (2020)

The 'Products' app, often called the Swiss army knife of store apps, was praised for supporting a variety of store tasks, unlike other more specialized apps. This versatility led to challenges in placement and growth, as it was often tasked with integrating new features for cross-functional alignment. Some initiatives, like the 'Selling' feature, were implemented despite not aligning with associate feedback or team goals.

Promotional elements such as credit offerings and sales were scattered throughout the UI, targeting customer interactions but rarely tested by users. This led to a bloated experience, hiding valuable information and causing navigation issues. The UI became gridlocked, making it difficult to prioritize new features.

In early 2021, Lowe's CEO Marvin Ellison highlighted inventory management concerns after experiencing issues firsthand. To address this, a 'shipment' feature showing Upcoming Arrivals was added, but it was hidden due to UI limitations. Despite strong performance reports (Ease of Use: 7, Usefulness Score: 6.88), the app lacked a clear problem statement, leading to uncertainty about its purpose.

Inventory information became a key focus, prompting discussions on how a redesign could impact associates' workflows and whether it was justified by the need for better inventory management.

Design Process

To identify which features of our app were most used, we needed a careful approach to ensure we didn't remove key information and functionality. The primary experience offered by the Products App is designed to be brief, with users being only one scan away from product details. While analytics track user behavior, they don't reveal what users are specifically viewing on the screen, requiring us to adopt a unique approach.

Visits to the Product Detail Page (PDP) and Extended Item Info (EII) were a focus, with EII being viewed 7 million times weekly. EII extends the PDP by providing detailed Inventory, Sales, and Order information. By analyzing user journeys from PDP to EII, we could determine what data was most relevant for store tasks and customer assistance.

Extended Item Info (EII)

Gathering User Preferences and Making Changes to EII. We anticipated that newer associates might struggle with EII navigation, so we aimed to ensure the experience was intuitive. A card sorting exercise revealed that most associates were comfortable categorizing EII content into Inventory and Sales, with a new category, “More Information,” emerging. This exercise confirmed the importance of inventory information and provided direction for improvement.

In March 2022, we conducted qualitative interviews and a quantitative decision matrix test with 9 store participants to understand how associates interacted with EII. We aimed to assess the value and comprehension of the provided information. The feedback was categorized into store tasks (Inventory) and selling tasks (customer engagement).

Our findings included:

Inventory information in the stock level tab was the most valued.
Sales information scored poorly, likely due to its relevance only to managers and supervisors.
Upcoming Arrivals (Inventory) scored low among newer associates, indicating discoverability issues.

This data guided our focus on inventory information for the next phase of work.

With validated insights, we presented our findings to stakeholders. UX and business partners collaborated to enhance the Product Detail Page through workshops, design sprints, and user testing.

We identified main themes: finding, knowing, and managing the product, addressing pain points like space usage, feature prioritization, and audience diversity. Use cases included locating products, being knowledgeable for sales, and managing store inventory.

We developed two low-fidelity concepts tested via a prototype on associates' Zebra devices. Both concepts shared a core structure but varied in presentation and behavior:

“Nested” Option
This concept featured streamlined, front-and-center content, reducing clutter and using gesture patterns for accessing additional content. It aimed for a modernized interface with essential information only.
“Flat” Option
Similar streamlined content but allowed users to scroll for additional information like Upcoming Arrivals, Nearby Store, and Item Recommendations, promoting sales beyond the store.

We tested the prototypes with 38 participants across 9 stores, presenting 5-6 tasks for each option.

"Nested” Concept

Pros: Tech-savvy users found it intuitive, modern, and easy to use.
Cons: Less experienced users found it challenging and noted that returning to the PDP landing page was not intuitive. Some information felt hidden.

"Flat” Concept

Pros: Positive reactions to additional content and intuitive scrolling.
Cons: Some confusion about the “More Info” button leading to mixed interpretations.

Common feedback included appreciation for new inventory content and enhancements. Associates stressed the importance of quick, easy navigation and raised concerns about unnecessary changes potentially slowing discoverability.

We adjusted the design to address concerns, such as enhancing the “More Info” arrow for better context and navigation. Each component was reviewed to support various inventory scenarios, ensuring accuracy and interconnectivity.

Ultimately, the “Flat” option was preferred by 75% of participants.

Conclusion

The final design achieved our goals, transforming the Products App into a comprehensive store tool. We integrated inventory information without displacing existing data, ensuring users retain access to familiar features while benefiting from new functionalities that enhance productivity.

The app now offers a more targeted experience, aiding associates in understanding product placement and management within the store. After presenting to stakeholders in Q4 2022, we received approval to proceed. However, due to lower earnings, the initiative is on hold, with plans to integrate key elements like Inventory Health, Inventory Request, and Inventory Visibility throughout 2023.

Details

Figma, Miro, Axure, User Testing

IAA Dispatch Research, UX, UI, IxD

IAA Dispatch

view project

The original desktop application was used across IAA branch operations to facilitate the movement of salvaged vehicles in need of being towed. As the number of vehicles increased, business would require Dispatch to perform more and more complex operations. Success of the application would be determined on complete adoption by its users.

All information in this case study is my own and does not necessarily reflect the views of IAA

Team and Role

In July of 2015 we had started Visioning and Discovery phases of the project where I led design of the Dispatch Management (DSPM) application, an enhancement of sorts for the original Dispatch (DSP).

I worked alongside our development team to implement the presentation layer (HTML/CSS) when we launched in September 2015. I continued to provide enhancements to both DSP and DSPM throughout the remainder of my employment at IAA.

1. Dispatch Listing

2. Dispatch Mapping

3. Tow Batch Review

4. Dispatch Management

In January 2018, I set out to redesign the DSP and DSPM to demonstrate internally to our teams the benefits of user informed design. Seven months later, I rolled out my findings as part of a case study that I delivered to team leads and members, in conjunction with an angular application proof-of-concept I developed, to help address usability and performance oversights.

Users

I originally performed interviews with our branch users as early as December 2014. For a full transcript of details, click here

The Challenge

Dispatchers, reluctant to abandon IAA's legacy platform, needed new ways to manage stocks, citing poor performance, usability issues, and a bloated interface.

As previously mentioned, DSPM was built to solve those problems. While it was successful, it still did not address feedback discussed during user research and testing.

So although DSPM had solved the initial issue of managing stocks, it created a whole new set of problems for DSP. My goal for the "improved" DSP/DSPM was to leverage our knowledge of the user and to improve overall experience.

Better integrate DSP/DSPM by deconstructing and rearchitecting a new workflow
Provide a responsive, modern layout and ui
Remove and/or consolidate redundancy

Design Process

Research & observation

While I had a general idea of what I wanted to accomplish, I still needed to validate my course of action. This meant exhuming whatever materials I had to support my case.

In total, I completed interview and screen share sessions with 6 branches, the smallest being Oklahoma City and the largest being Houston, as well as 2 trainers.

Listing Screen
	Small Branches	Medium Branches	Large Branches
50% Branches Divided on Selecting Stocks Larger branches favored the listing screen while reacting negatively to the mapping screen. Smaller branches were indifferent but used the table in the listing screen differently than larger branches. Atleast 2 Branches suggested they would like to consolidate both into one screen
33% Pagination and Stock Visibility All large branches indicated they would like to remove pagination while medium and smaller branches preferred to paginate their results
83% Custom Table Data 5 of 6 of Branches suggested that they would prefer to add/remove columns from the listing screen data table
Mapping Screen
50% Information Overload Half of branch users interview indicated that most pin icons hold little meaning or relevance and could be removed Trainer Comments: too many pins in legend confusing to users
17% Indicate Selected Stocks Atleast 1 Branch suggested a counter for selected stocks Trainer Comments: the distinction between selected and unselected stocks on the map could be stronger.
33% Generating Routes It was found that in larger and medium sized branches (2 of 6 branches), maps are printed and given to tow companies create their own routes, rendering the generate routes functionality useless Trainer Comments: “Generate Route” needed at the smaller branch level but not at the higher branch level
Review Screen
83% Manage Stocks 5 out of 6 branches agreed that the ability to logout and manage check payments for stocks in bulk would be beneficial Trainer Comments: current system was too cumbersome to logout one at a time in legacy
17% Hierarchy and Legibility At least one branch felt that the tabbed sections in the modal were difficult to read, citing font size, shading, and redundancy as the main cause.

Discovery & Exploration

What I discovered in my process was that there were glaring differences in preferences between large and small branches. I was also surprised to find that the legacy platform showed real advantages over the modernized application, particularly with the time it took to complete the dispatch process as well as training involved with newer users.

I was willing to reconsider the assumption that a more modern interface is a better interface. Underneath it all, users valued accomplishing their task faster over the options and features given to them in this modernized experience.

A lot of the negative feedback embedded in user voices was based out of a similar frustration. “How do I accomplish my task faster”? So by consolidating functionality and providing users the ability to say, keep settings, I was able to remove layers of repeated steps needed to perform the necessary tasks.

User Interface Design

First, I needed to deconstruct DSP’s many features by helping the user concentrate on one task at a time. As a result, I wanted to explore using mobile first methodologies.

A. Shortening the Journey

I began to think of the “List”, “Map”, and “Review” dispatch screens as a form with 2 steps - “Select” and “Dispatch” with complete visibility of the entire process on one screen. Validation would prohibit the user from skipping steps.

B. Consolidating "List" and "Map" Screens

An observation made during the interview session was that a lot of data was duplicated from map to listing screen. No longer would users have to select stocks from a list and then refine that search within a map. Now a user could toggle between selecting stocks from a list OR a map while still fulfilling the same requirements.

C. Treating features as secondary

Redundant tasks such as selecting a branch, filtering stock lists, or adding/removing table columns could be performed once or even saved to a user’s preferences. It would always remain accessible within the applications settings or feature panel.

D. DSPM History

When designing the original DSPM screen we couldn’t load all dispatched stocks or the application would crash and so search criteria was added. But for the MDSP, I proposed users could also search using an associative list of dispatched stocks based off date.

Interaction Design

1) User selects a branch

2) User creates a batch of stocks by selecting from a map or list

3) User selects a tower to carry out the dispatch

4) After completing a dispatch, user chooses to dispatch more stocks or manage existing dispatched vehicles

5) User selects a batch to manage

6) User selects an action to perform against the dispatch stocks

User Testing

Overall, users felt the "improved" DSP/DSPM interface was pretty intuitive and a step up from the previous design. However, initial testing showed that after completing a dispatch, it became less clear what to do after a dispatch was submitted. The results were encapsulated and used to inform the development of the angular application that I was building in tandem with the mobile design.

Conclusion

I delivered both the Mobile POC as well as Angular POC to an internal team of designers and developers. I did not expect to change minds overnight but I do think that I was successful in presenting the case for user driven development which is commonly overlooked when delivering minimal viable product.

Details

Tools
Sketch, Invision, Material Design Kit

IAA Stock Cancellation Research, UI, IxD, Strategy

IAA Stock Cancellation

When a stock is cancelled, it typically means the vehicle is being returned to the provider. But up until this point, the settlement agreement between parties did not include expenses incurred while the vehicle remained in IAA’s possession. As such, business needed new ways to track various checkpoints during the vehicle lifecycle.

All information in this case study is my own and does not necessarily reflect the views of IAA

Team and Role

I worked alongside our Product Owner and BSA as the lead designer to communicate and illustrate design artifacts to fellow team members and stakeholders from October 2015 to December 2015.

Users

This project was unique in that we would talk to not just branch users and call centers but the primary business units (ie. eBiz and CSA Today) to garner insight from all perspectives involved.

The Challenge

While the "system" would to do most of the tracking behind the scenes, the application still required users to act as gatekeepers. Variables included type of users, vehicle lifecycle, as well as the physical location of the stock. The experience had to be seamless.

Integrate multiple entry points into a system needed to streamline the process for cancelled stocks, from “request” to “approval” to “settlement”.
Track vehicle expenses along the way.

Design Process

Strategy

Wireframes were drawn up to detail numerous system paths.

wireframe credit: Srikant Chandan

Research & Observation

Because strategy was being developed as we progressed, it was imperative to show how the data was being collected. Various aids were used to communicate and illustrate concepts during visioning.

Discovery & Exploration

After a workflow was agreed upon, a generic UI was developed in order for easy consumption of ideas.

Interaction Design

The prototype had proved considerably useful when demonstrating the application to business owners and stakeholders. How the application would behave asynchronously as stocks would enter and exit a queue was instrumental in understanding the UI.

User Interface Design

A modern interface is given to the UI to reflect current design system.

Stock Approval

User clicks "approve" to move stock into the the disposition queue.
User clicks "deny" to remove stock from approval queue.
Stocks entering and leaving queue in real time to reflect accurate data.

Stock Disposition

Filter Table by status
User clicks "undo" to move stock back into the Approval Queue.
Stocks, Images and Dispatch status are updated asynchronously and then moved to the Complete Settlement queue.

Stock Settlement Completion

User clicks "undo" to move stock back into the Disposition queue.
Stocks entering and leaving queue in real time to reflect accurate data.

Conclusion

The ramifications of implementing a project like Stock Cancellation would have created a workflow change that leadership was uncomfortable with. Others felt it could not be fit into a 6 month project. And so in the end, Stock Cancellation was quietly abandoned.

Details

Tools
Adobe InDesign, Sketch, Axure

IAA Support Dashboard Research, UI, IxD, Strategy

IAA Support Dashboard

The Support Dashboard was to be built as a centralized location for IT Support Team members to manage and respond to service tickets. While the initial vision for the dashboard was broad in scope, development's need to focus on its new services architecture quickly dialed down the number features it had intended to address.

All information in this case study is my own and does not necessarily reflect the views of IAA

Team and Role

I worked alongside our Product Owner and BSA as the lead designer to communicate and illustrate design artifacts to fellow team members and stakeholders.

"Watchdog" Legacy Support Application

"PDF Print" Legacy Support Application

Users

I originally performed interviews, questionnaires, and user testing with our support team in March of 2016.

The Challenge

Ultimately, I wanted to provide a UI that was scalable while still promoting visibility of open items/print issues. Support operators fully expected an application not too different than what they were already familiar with. The ability to manage printers from the application would only empower them more.

Provide operators the ability to easily monitor/scan printer support queues.
Provide operators the ability to search and manage printers remotely.

Design Process

Research

I employed a broad range of techniques to identify problem areas and improvements as documented below.

Interaction Design

A prototype was eventually given to users to gauge adoption of the product.

The page features visibility to status, failures and pending jobs in real time as well as capabilities to add/edit/remove printers from branches.

Discovery & Exploration

A low fidelity mockup was created to help solidify acceptance criteria.

A high fidelity mockup was created to help guide developers at the time of implementation.

User Interface Design

Newly rendered mockups using standardized design library components.

Monitor Screen

Monitor Print Queues Individually.
Status Queue and visibility important.
Ability to pause/play refresh rate.

Manage Screen

Ability to add printer.
Ability to filter and sort printers by name, branch, or IP Address.
Ability to edit existing printers.

Conclusion

The application launched in March 2016. It continued to provide users the ability to support print issues until 2018 when it was retired by leadership looking to repurpose its platform.

Details

Tools
Adobe InDesign, Sketch, Axure

UX Skillset

Process

Research
- Identify the user - Define (the problem space)
- usability testing, cared sorting, web analytics, field studies, and heuristic analysis
Usability
- Usability Testing & Analysis
Information Architecture
- wireframes
Interface Design
- deep understanding of user interface design patterns and best practices
- Visual Design/mockups
Interaction Design
- Interactive Prototypes
Strategy
- Analytics

Primary Tools

Sketch
Adobe CC
Axure
Invision
Zepelin

Extras

some html/css/javascript
agile ready (link to agile badge)

UXdesign view ux skill set

UIdevelopment view ui skill set

IAA Dispatch HTML, CSS + Angular

IAA Dispatch

view project

Dispatch is an angular application proof-of-concept I developed in 2018. It was presented as part of a case study that I delivered to team leads and members, in conjunction with a mobile application I designed, to help address usability and performance oversights.

All information in this case study is my own and does not necessarily reflect the views of IAA

Team and Role

I developed the proof-of-concept application in 2018. It was done independently of team members and without management oversite for the purpose of discovery and introspection.

The Challenge

With each of its 3 screens making calls to the backend, the previous application was cumbersome and slow. Users complained of performance deficiencies as well as a UI that was repetitive. A conversation with my product owner over how to consolidate the design revealed that Dispatch could infact use a rewrite.

After some deliberation, I chose to focus on the client side as a viable performance solution. To legitimize what I was trying to accomplish, I would keep as much of the original requirements intact as possible. As such, I would build as a mobile friendly desktop application.

Demonstrate how web performance optimization could be improved through the use of a client side framework.
Preserve core acceptance criteria.

The Delivery

Client Side Framework

Written in .NET MVC, the previous application employed a surplus of javascript component libraries, including jQueryUI and KendoUI for interface interactions. My intention for picking a client side framework would be to show the performance advantage of handling data on the front end before passing to the backend while using as little dependencies as possible.

To execute the "List" and "Map" screens, I went with Angular over React, which offers two-way data binding. Vue.js was also a consideration, although I believed, it just wasn't as much support and documentation available. That being said, I found Angular's CLI tool incredibly helpful and easy to use as it relates to all perspectives of building an angular app (compiling TypeScript and SCSS, creating components and services, linting, testing, and deploying).

Consolidating "List" and "Map" Screens

Data Storage

Without a SQL database, I would not only need to find a data source but create one as well. As a result, I created a CRUD component for my project using Firebase's Cloud Firestore, a NoSQL document database, to develop my content dynamically and query my application against.

Rest API and local storage to retrieve and set data

Firebase Cloud Firestore

CRUD

Mobile Friendly UI Component Library

Dispatch, at the core, is a form used to collect data and update records. With proper validation in place, as outlined by the requirements, it could potentially exist as a SPA as a step by step wizard. I didn't need to look any further than Angular Material, which provides components for data tables and autocomplete as well. Not only is it a comprehensive library but offers responsive layout solutions. It even includes its own set of SVG icons, a performance advantage over the previous application's reliance on PNG images.

Angular Material For UI Layout and Components

Stepper w/ Validation

Autocomplete

Navigation

Datatables (NGX)

Sort and Filter

Angular Google Maps (AGM) and Drag n' Drop (Dragula)

Conclusion

In the end, I believe I presented a strong argument to my team in favor of using a client side framework to improve performance on our projects while also preserving its core requirements. Not only did it help to create some discussion but also changed some perception on what we can achieve when we are committed to solving a problem.

Details

Technologies
HTML, CSS, JS (Angular, TypeScript)

UI Components
Angular Material

Data Storage
Firebase Cloud Firestore

3rd Party
Angular Google Maps (AGM), NGX-Datatables, Dragula.js

Bricks Inc Website Brand, Inform. Architecture, IxD, CMS

Bricks Inc Website

view site

Bricks Inc, a family owned business based out of Chicago, deals in masonry, reclaimed materials, and window/door systems. The owner, Brent, a connoisseur of Chicago's history of architecture and design, did not feel as though his online presence reflected that of his work.

Team and Role

I worked directly with the client as the designer and developer for his website and brand. Bricksinc.net launched in 2016.

I continue to work with the client, managing website updates and enhancements throughout the year.

Original Website

The Challenge

In 2016, the client reached out to me to request a rebuild of its website. After performing an audit of the previous site, it became clear that his "Products" and "Services" lacked segmentation. "Projects" contained little or no content for users to consume. It was imperative the rebrand connected with his base, but also to new users. In addition, the client wanted to make sure that the site was scalable and robust enough to grow with each new project but also pivot alongside his marketing team, publishing content through his blog and case studies.

Satisfy brand requirements as outlined by the client.
Build a scalable CMS website that could exist as a standalone showcase for "Projects" but support an ever changing list of "Products" and "Services".

Design Process

Brand

An emphasis was placed on creating a mark that was modern and architectural in style but contained past elements such as color and the brick reference. I offered three different variations of the mark which the client chose from.

Information Architecture

After providing an audit of the site, it was clear that the client's project showcase was in need of organization in regards to its presentation. I not only suggested using the home page as an immediate entry point into the client's work, but also introduced classification, resulting in content that was more digestible for users.

Interaction Design

I used Adobe XD to create a working prototype of the product and to gain acceptance by the client.

Delivery

Wordpress CMS

I provided a child theme that supports managing new projects, posts, case studies, and contacts

Project Work Flow

1. Select a category from the landing screen

2. Select a project from category

3. Project Detail

4. View Gallery from project

Manage Content

Vendors

Contacts

Page Content

Responsive

Responsive website with lazy loading images

Conclusion

By shifting content to focus primarily on "Projects", the marketing and sales team are able to direct users to their extensive body of work quickly and efficiently. Bricks Inc continues to innovate, using their brand and website to communicate to their audience while promulgating their marketing operations on the fly.

Details

Tools
Adobe XD, Kulor

UI Toolkit
Bootstrap

CMS
Wordpress

Technologies
HTML, CSS, JS

IAA Modernization HTML, CSS + Javascript

IAA Modernization

An initiative by IAA to standardize its legacy applications and services, "Modernization", as it was called, was a large-scale, cross-functional effort that required its development teams to rewrite entire applications to conform to a modern, single code base.

All information in this case study is my own and does not necessarily reflect the views of IAA

Team and Role

From 2014-18, I worked with multiple teams, focusing primarily on presentation layer development but also assisting with design, to help standardize over a dozen legacy applications.

The Challenge

At the core of the operational business unit sits ASAP, the central hub of IAA's suite of applications, dedicated to providing branch users the ability to complete their day-to-day work tasks. To improve usability, a modern architectural framework was constructed, in addition to new global components, carefully designed and built to ensure the success of their users.

After implementation was complete, the codebase was shared and duplicated across teams and across products. As such, maintaining a single codebase became increasingly difficult to maintain. To eliminate duplication moving forward, an external stylesheet was shared across the network using a CDN while older products, such as Legacy, would required patches.

Build a single codebase shareable across current and future products.
Update and maintain an ever growing pattern library.

The Delivery

"Front End Modernization" was a concept that had been floated around by business since 2014 but didn't reach fever pitch until the middle of 2016 when global components were finally conceived, designed and developed. I was responsible for developing the ui for "Quick Search", "Stock Search Results", and "Stock Detail" while integrating and ensuring code solubility for all new global components across legacy and modern solutions.

Quick Search

Quick Search returns recent searches on focus and filtered criteria on input. Users can also tab through and search against various categories without leaving the text field using mousetrap.js.

Stock Search Results

The responsive data table (telerik kendo UI) fits optimally within the page and features a group, sort, filter, add/remove, print, and export capabilties.

Stock Detail

Stock Detail exists anywhere in the application where a stock number is clicked. A tray slides out and a user is able to perform vehicle lifecycle tasks.

Post-Modernization, an internal design system and component library (based off the bootstrap toolkit) was created to promote design consistency and scale design efforts of future projects across IAA business units. The following products are just a few examples of projects I was involved in.

Transporter Pickup

Mobile first application allowing users to pre-register vehicles for pickup.

Remarketing

Remarketing marks the launch of its auction channel for targeted buying and selling.

Title Stock Search

I used CSS Grids and Chart.js to develop a ready made HTML template for multiple dashboard screens.

Bulk Notes

Bulk Notes was built to add/import a collection of notes to a stock (Kendo UI)

The Pattern Library, part of the IAA Design system, is a style guide and component library given to developers to assist in building a more efficient and consistent UI across IAA - https://uxcomplib.iaai.com/. As such, I helped lead and develop v1.2 of the Pattern Library. My responsibilies included:

Infrastructure and framework
Coding task assignments
Developed process for code sharing (JS Fiddle)

Conclusion

In September 2018 version 1.2 of the Pattern Library was launched. It was well recieved among colleagues and continues to provide guidance to developers at IAA at the time of this writing.

Details

Technologies
HTML, CSS, JS, JSON, ASP.NET MVC

UI Components
IAA Pattern Library (Bootstrap)

3rd Party
Telerik Kendu UI, Chart.js

GPS Website CMS Wordpress

Glenbard Parent Series Website

view project

Glenbard Parent Series (GPS) prides itself on presenting only the most distinguished authors, clinicians, and educators at their events. They needed a platform for which to manage and showcase their speaking engagements, in hopes of connecting and strengthening the community at large.

Team and Role

I worked directly with the client as the designer and developer for their website. Glenbardgps.org launched in 2015

I continue to work with the client, managing website updates and enhancements on a yearly basis.

The Challenge

The client was determined to go live by the Fall of 2015, giving me about 3 months to design and develop what was originally scoped as a wordpress themed website. But nearly as soon as we began, new features presented themselves in the form of a fully functioning event calendar. The client needed a website to manage speaking engagements by category and date as well as distribute their content online. Additional requirements included the categorization and archival of events as well as support for bilingual content.

The Delivery

Child theme that supports managing speaking engagements, archive, and segmentation

Wordpress CMS

Home Page

List includes next 3 upcoming events in ascending order

Upcoming Events

List includes upcoming events for the remainder of the year in ascending order

Past Events

List includes past events from January to present in descending order

Categories - spanish

Admins can tag events to create categorization

Details

Event Details provides users with date, summary, and venue information

Responsive

I utilized Bootstrap grid for the site's responsive features.

Conclusion

GPS Successfully launched in Aug 2015. Since then, I have made updates to the site to make updating through the dashboard easier for the client.

Details

UI Components
Bootstrap

CMS
Wordpress

Technologies
HTML, CSS, JS

3rd Party
WP Event Calendar

UI Skillset

My Services

Single Page Application
Responsive
CMS

Frameworks

Client Side: Angular, Backbone
UI: Bootstrap, Material, kendo, Semantic

My Languages

HTML5, CSS3, JS/JQuery

measurements/analytics
Unit Testing
Performance and Optimization

Extras

some User Experience
agile ready (link to agile badge)

Hi, I'm Michael Duve.

UXdesign view ux skill set

UIdevelopment view ui skill set

The Products App, essential for associates to help customers, became cluttered with untested features, burying key information. For an effective redesign, we needed to deeply understand user engagement and task workflows.

Objective

Team and Role

Users

The Challenge

Design Process

Research & Observation

Store Feedback (EII)

Design Discovery & Exploration

Workshop

Design Sprint

User Testing and Validation

Final Design

Conclusion

Details

Team and Role

Original DSP and DSPM (2015)

Continuing exploration and process.

Users

Trainers, Branch Managers and Dispatchers

The Challenge

High level goals and Objectives:

Design Process

Research & observation

Assessing Feedback From Trainers and Branch Employees

My Findings

50% Branches Divided on Selecting Stocks

33% Pagination and Stock Visibility

83% Custom Table Data

50% Information Overload

17% Indicate Selected Stocks

33% Generating Routes

83% Manage Stocks

17% Hierarchy and Legibility

Discovery & Exploration

User Interface Design

A. Shortening the Journey

B. Consolidating "List" and "Map" Screens

C. Treating features as secondary

D. DSPM History

Interaction Design

User Testing

Conclusion

Details

Team and Role

Original Stock Cancellation (2015)

Users

Mostly the Business

The Challenge

High level goals and Objectives:

Design Process

Strategy

Research & Observation

Discovery & Exploration

Interaction Design

User Interface Design

Stock Approval

Stock Disposition

Stock Settlement Completion

Conclusion

Details

Team and Role

Users

Support Operators

The Challenge

High level goals and Objectives:

Design Process

Research

Interaction Design

Discovery & Exploration

Lo-Fi Interaction

Hi-Fi Interaction

User Interface Design

Monitor Screen

Manage Screen

Conclusion

Details