Van Arsdel Inventory
An enterprise app for managing inventory of smart lights
Overview & Goal
A sample app intended to showcase future elements of Microsoft’s fluent design system, as well as take advantage of the enterprise field as huge potential market for UWP apps by showing partners the possibilities of the platform.Responsibilities
Domain Research, Information Architecture, Mood-boards, Concepting, Wireframing, Prototyping, Mockups, Project management, Presentations, Logo designDeliverables
UWP App, Specs for developmentTools
Photoshop, Adobe XD, and FigmaTeam
Vlad NoginBuild 2018 Presentation
As the enterprise equivalent of the Van Arsdel consumer app, it was also presented at Build to showcase latest and upcoming features. Check out Fluent Design: Evolving our Design System to learn more about what the Fluent team does.
Designs
We created designs in Adobve XD and Figma for final touches. As this was a task-driven app, we tried communicating the focus through hierarchy and layout, i.e. we used a side navigation as opposed to top nav like in the consumer app, search and filters above the data table, and used the new high density rule making the content more compact for productivity-focused use.
Process
Due to limited time, we relied on existing internal and external research, as well as competitive analysis to understand user needs in the enterprise realm. Then, we started sketching and white‐boarding concepts and flows, creating wireframes and getting buy-in from senior leadership and decision makers. Similar to the consumer app of Van Arsdel, we faced the problem of not being able to use newest capabilities and updated controls as this process occurred parallel to the updates. Thus, many improvement suggestions were postponed to phase 2 and later.
The bottom two images also illustrate how material, color and depth can help guide the user, i.e. content is divided into areas, and otherwise permanent content become transient menus at smaller screen sizes.
Wireframes
Motion
A quick Motion concept shows the new inline editing capabilities the data grid pattern allows.