A Windows Desktop Application for PC to PC File Sharing

The Ask

A standalone Windows desktop app capable of running on a Windows 7 platform with standard Windows functionality such as browsing to a file and uploading content to be parsed in a database and displayed in a table. The ability to utilize a standard set of controls featured as show in the original app but laid out in a more user-friendly way.

The Original Application:

It’s hard to even figure out what to do here, and it’s such a cognitive overload on the user.

Original DIgine Application
Original Application Screenshot

The New Platform:

Being built on Windows 7

About the Project: Must Haves

Interactive menus and tables

There are several screens that show some of the menu interactions such as a slide out menu drawer, menu switcher for different sets of menu functionality (by user type) the selection of an entire table row, a drop down of an individual table cell for editing, and content alerts for items needing immediate attention.

File browsing capability and revisiting those menus/ interactions

The UI shows basic file browsing capability. Single file upload was to be supported in this version, batch app uploading was pushed out to a later version.

Adding a collapsible/ expandable filter menu

The menus got a bit more refined as the interaction design was underway. The table interactions became more of a realistic idea of how the app would look and behave on Windows 7/ 8.

The first pass in Axure Pro RP

App Filters
In Line Editing
Selectable Rows and Columns
Drag and Drop Upload

Putting it all together and switching gears

As I was working with engineering on this project it became easier to translate the HTML and CSS over into bootstrap framework and utilize their library along with J-Query libraries for code implementation. The final screenshot shows the last pass of putting the code together in Dreamweaver Live View, and browser testing in Google chrome. The final output code delivered to engineering is responsive, the filters shown are placeholders being configured by engineering.

Switching Gears to Bootstrap
Completed Bootstrap Application

Success Metrics:

The Bootstrap version of this app was much lighter, easier to maintain and a lot easier to use! The client loved the ease of use and update in look and feel. It made their day to day tasks a lot easier and was simple to translate to the

My Role
User Experience Designer & Front End Developer
Project Duration
2 Months
Tools of the Trade
Adobe Illustrator, Axure, Adobe Dreamweaver, Specctr, CSS, HTML, Bootstrap
Project Deep Dive
Decisive Data