Menu

Filter

Social

AppNeta – Unified Navigation

When I first started working at AppNeta, one of the first things I noticed was that the initial product I was hired on to (TraceView) was not well integrated with the company. In addition to this, the rest of the products in the company looked very outdated. The original navigation for PathView, AppView, and FlowView was unified but used an old school accordion style menu with some gradient capsule buttons.

Adjusting the look and feel of everything within each product would take a great deal of effort and time, so I proposed a new navigation that incorporates all 4 products and helps make what’s already there look better, as the updated navigation frames everything else on the page.

With this new navigation, AppNeta is better suited to showcase that it is an all encompassing application performance management tool. We are also able to more easily cross sell and cross demo all of our features without a disjointed experience. The integrations that were already in place within the product feel smoother and are not as disparaging to the user’s experience.

unified_nav_appview

unified_nav_traceview

unified_nav_pathview

unified_nav_flowview

TraceView – App Map

The app map shows developers at a glance the infrastructure of their applications and the components that make them up. They can easily see if anything is on fire and if the issue is with something internal (an alert was triggered after a code deploy), or external (a network is down because their provider is having an outage).

I worked with the TraceView product manager to define the feature set and scope of the project. Together my product manager and I user tested various mockups and shopped them around to ensure they were a good direction. I also worked with developers to ensure designs were technically feasible while remaining performant for users. With the vast amount of data that is potentially displayed in this view, this was a key challenge to contend with.

Press Release

Live:
final_app_map2

Final Prototype:
final_app_map
See it in InvisionApp

Some directions we didn’t go in…

Grid mode (too complex/unintuitive)
grid_mode
See it in InvisionApp

Data on Nodes (overwhelming/not performant)
nodes_with_data3
See it in InvisionApp

ORSYP – Small Projects

I worked on a few small projects at ORSYP to spur new ideas among development teams in other offices. The other teams in my company worked on products relating to server and application monitoring, to let a user know as soon as possible when something has failed or is likely to.

Dashboard & Server Monitoring Concepts

Application & Job Monitoring Concept

Operational Diagram
orsyp_diagram

ORSYP – uX

As a user experience designer at ORSYP, I worked with a team of 5 developers on “uX”, a product that sought to link business and IT metrics, allowing a high level executive to make correlations to how their IT was affecting their business. Using agile methodology, we met with the stakeholders of the project once every two weeks to demo our progress and respond instantly to feedback.

You can find some video and stills of the product in action below.

Stills:

Implementation:

Screen Maps:

screenmap1_small
screenmap2_small
screenmap3_small

Brafton Infographics

Working at Brafton, I was interacted with a multitude of clients from different backgrounds to produce infographics. The goal was generally to promote the company in an implicit way to generate pageviews and conversions on social media.

singlepoint_buysellrealestate_unbrandedsaleswarp_ecommerce3_unbrandedroex_food_for_thoughtows_your_body_protein_unbrandedtradingpub_world_currency_unbranded

What’s Up With Vending

What’s Up With Vending was a small project I created in an effort to bring interactive graphics to Brafton, a content marketing firm I worked at. The company currently offers static infographics, but I wanted to push their services further and give them an opportunity to potentially expand their offerings.

For full interactivity, please visit http://quintinmarcus.com/vending/, however you can also scroll down for a full length screen snap of the graphic in it’s entirety.

 
vending_hq

Senior Thesis 2012