Product Design

Gas Distribution Monitoring Web Application

How could we empower gas distribution managers to oversee their business in one glance?
Product launch video
ROLE
Product Owner and UX Designer

•
Project management
•
•
Team building and management
•
•
People management
•
•
Tech project management
•
•
UI design
•
•
Software development
•
•
Project scoping
•
•
Project planning
•
•
Stakeholder management
•
•
Prototyping and testing
•
•
Presenting and documenting work
•
EMPLOYER
As a solo consultant in partnership with
Cason Engineering Plc.

Cason Engineering Plc. provided a wide range of data collection and network monitoring technology solutions to the participants of the international energy, logistics and security market.

Client

Challenge

Cason provided wireless data monitoring solutions to the largest energy companies in the EMEA region. In 2013 we developed a new service aimed at gas distribution executives, providing a high-level picture of their operations.

People

It was a one year long project with a three person core team.

I wore three hats:

  • I was the Product Owner in the agile project, interfacing the dev team with business.
  • I was the UX Designer, working a few sprints ahead of the dev team.
  • I was the Tech Lead for web application and REST API development.
Results

Companies from 7 countries launched pilots in the product’s first three months, including a gas distribution company in Calgary.

Process

We used Scrum, an agile methodology. UX Design was an organic part of the delivery model, with wireframes scheduled a few sprints ahead and design iterations paced with the sprints.

1. Prototyping backlog items

  • Business and user needs, use cases
  • Feedback from previous deployment
  • Functional wireframes (Axure, Keynote, HTML)
  • Testing prototypes with business stakeholders and user gatekeepers
  • Constant involvement of developers
  • UI designs (Keynote, HTML)
As our product’s stakeholders were hard to reach executives, I utilized gatekeepers like our sales people and subject experts to test my prototypes.
We continuously deployed the latest designs so the ongoing sales pitches were the ultimate tests.

2. Coding and shipping backlog items

I was the Tech Lead on the front-end and RESR API dev team

  • Develop user stories according to wireframes/UI designs (HTML, JS, MVVM)
  • Develop REST API (.NET, Hypermedia)
  • Test and deploy
I served as a product owner, coded the front-end of the web application and supported after-sales by training our international partners.

Highlight

I architected this web application as a state-less hypermedia app whose flow was driven by server responses.

The business benefits were quicker rollout times, as no changes were needed on the front-end and a versatile, simple and highly reusable code base.

From a design standpoint it meant a highly modular approach.

An Alarm’s (work in progress) page in the web application. The app was completely driven by the API responses. In this example above, the Alarm page corresponds to the Alarm resource instance returned by the API. The page is dynamically built from the Alarm resource’s properties and its linked resources such as the Place of the Alarm.

‍

How I did in this project?

Francis and I worked together for several years. He is one of those young talents, who is not only a great creative mind, a real creative thinker, but also hard-working, proactive, a real initiator, with meaningful content, who will never give up. I still remember well his design concepts, artistic touch on several projects we worked together for EMEA within IoT solutions. It is a real fond memory when we prepared for the Microsoft events, MS case studies, MS keynote speeches, MS partner presentations together.

Mercedesz Trum
Mercedesz Trum
Marketing Director, Cason Engineering Plc.
GitHub
Twitter
LinkedIn