Hourglass: Transparent Timekeeping

How a simple conversation with a client about time-keeping led to some late nights, reflection on project tracking & a simple progressive web app…

Good morning/afternoon/evening (delete as appropriate)!

My name is Bryce Wilson; Lead UI developer for the UK Design Team based in Edinburgh. I currently work across multiple projects and platforms and it can be hard to track what I work on and for whom. For the client, it can be frustrating when they can’t get a fixed timeline on my availability.

Around the same time I was coming to the end of ‘yet-another-notepad’ scribble of loose time keeping, I had a chat with one of the project managers for a fantastic client I work with.

He was concerned that he wasn’t able to have a visible overview of all the contractors and consultants in his team. This is primarily down to the flexibility the project offers to the team; early starts, late finishes, working from home on occasions etc.

This screamed out an opportunity to fill a few needs with one deed:

  • Upskill myself on a few new technologies I’ve been itching to try
  • Get rid of my legion of notepads with illegible cave drawings and scribbles
  • Supply a very cool and awesome client with a solution that will enable them to continue providing us with a flexible working environment
  • Demonstrate to the wider community a landslide of user-centered design approaches being developed daily within the UK Design Team (headed up by Luke Jeavons) such as:
    • User Journeys – A visual representation of a path a user may take to reach their goal when using a particular product or service.
    • Usability Testing – To validate the effectiveness of the design and the way the user interacts with the system. This can highlight potential inconsistencies and issues with the product or service.
    • Wireframes – A visual guide that represents the page structure, as well as its hierarchy and key elements.
    • Interactive Prototypes – To show how interactive elements will work. Enables the product or service to be visualised, tested and validated before further development.
    • + much more

After speaking with some fellow upstanding colleagues, I took it upon myself to define an MVP backlog of simple requirements:

  • Allow access to a ‘clock-in’ system via any device and bypass any requirements for an installation
  • Login with work email
  • Allow manual entries of working hours
  • Allow a clock in/out feature
  • Keep it simple, avoid that (points in horror at existing time reporting tools in the market)

Given this was a pet project I didn’t want to overreach and take focus away from day-to-day within the Compass project and the Design Team so I gathered my weapons of choice and began.

Frameworks & Services

In order to maximize the time and effort spent getting this from farm to fork:

  • Contentful – an AMAZING headless CMS that has insane API control and access. I have utilized this to store and retrieve data in a fully secure environment
  • Vue.js – The MacDaddy of JS frameworks. I work with Angular, React, Node, etc and Vue.js slays them all dead. End of.
  • Element.io – A clean and simple Vue.js orientated components library for all the basic needs
  • Azure – The Sopra Steria single sign-on application front
  • Heroku – Free and simple app hosting with CD/CI Pipelines
  • Custom Node.js API Service – I have developed a customised API service to enable continuity of other applications I have created (regardless of framework) to knit together user and information

It started with a few hours in the evenings while my expectant wife lay on the couch binge watching Forensic Files (If I suddenly disappear, you know who to point the finger at!) I melted into my coding chair and got to work.

A few nights in and it begins to take shape; implementing simple features such as project and team control which is operated in the Contentful Dashboard. This allows me to add additional projects as they come up.

The first release of the app to my inner circle highlighted some interesting results:

  • Observation: One user found it difficult to navigate their way back to the current week & also found it time consuming to try to get to December for example, to input time
  • Suggestion:
    • Implement a ‘jump-to’ week selector where it displays the week information; allowing the user to easily jump forward or backwards in time
    • Always have ‘current week’ at the top of list to highlight the current week
  • Observation: Initial version did not allow for non-project codes such as holidays, training or meetings to be logged
  • Suggestion:
    • Allow time to be logged to ‘non-project’ codes through the same interface
    • Allow team leaders to see these days on the team leader view. This allows the project leader to see upcoming days where we might not be utilized. It’s no fun for the client sifting emails and syncing calendars to see why ‘Dave’ hasn’t shown up today!

Reaping the Hard Miles

A few seasons into Forensic Files (my wife at this point now knows how to dispose of a body in 50 different ways, just saying) and we start to have something testable!

As the app is cloud based I fired out a link to a few trusted amigo’s and it seemed we were pretty close to the mark!

With the intended users now having something tangible in their hands, the next goal was to give the client the keys to the kingdom – an external (or internal) team leader view.

A non Sopra Steria user can be set up within the system to retrieve all entries which are assigned to their project, including holidays, sickness etc.

Given that a lot of our teams are also internal, a Sopra Steria employee can also have a team control panel if they are assigned a team leader role.

The Verdict

After picking a handful of users to test the app, we took a period of 1 week to collect initial feedback and log any issues.

Each user was asked to carry out specific tasks and report back, for example:

  • Successful and unsuccessful clock-in/clock-out experiences
  • Test on different devices and networks (firewall etc)
  • Log upcoming holidays

The feedback from actual ‘live’ usage resulted as:

  • Request ability to add ‘half-day’ non-project events
  • Improve performance for older Android phones (now complete)
  • Return to same week that a logging was added to (now complete)

The client is very happy with the outcome so far and has adopted this very early MVP into the projects daily routine!

There is still A LOT to add to Hourglass but given its been about 40 hours of development from a single developer and some fantastic sound advice and guidance from the UK Design Team – I reckon it’s not half bad!

If you would like to ask any questions, please get in touch :

bryce.wilson@soprasteria.com

Everything is connected. Don’t innovate in isolation

…These are the words Alberta Soranzo left the audience with as she drew the final keynote speech of this year’s UX Scotland conference to a close.

Alberta, who was recently appointed Director of End-to-End Service Design at Lloyds Banking Group, strives to make a real impact on the financial outcomes of people by taking a look at both the big picture as well as focusing on the very small things, which she believes ‘matter a lot’.

Alberta stressed the importance of nurturing diverse talent and stated that it is vital to foster a culture of continuous learning within a design team. This is something that resonated with me as a culture we are striving to cultivate here at Sopra Steria — through hiring a diverse range of people from a whole range of different backgrounds and with differing areas of expertise. However, most importantly, each of these individuals share a desire to learn and continually improve. This allows the design team to avoid the previously mentioned isolated innovation which Alberta warned about and work as a team to grow and develop.

Those who attended UX Scotland may well have met the various members of the Sopra Steria team who were there – either during the various workshops and seminars on offer or at our stand in the foyer. Some may even have entered our interactive competition which invited people to ‘step into out customers shoes’. Through sponsoring the stand we were afforded the chance to speak to a whole host of interesting people during our time at the conference, including a couple of people who have since interviewed for and accepted roles within the Service Design team at Sopra Steria.

Over the course of the three day conference we got the chance to experience a number of great talks by a range of different speakers. We were given the opportunity to hear from leading industry experts such as Jared Spool and Dana Chisnell. We were also able to take part in the various workshops on offer which allowed us to develop our existing skills as well as learning new ones.

With many of the talks and workshops occurring at the same time, there were understandably frustrating moments where we were unable to attend all the talks that we would have liked to. Thankfully, with so many members of the team present at the conference, we were able to minimise the effects of timetable clashes by spreading ourselves across the events which occurred at the same time. By taking notes during each session, team members were able to report back and share their knowledge with the team who were unable to attend.

Our Service Design team listening to Jared Spool’s keynote speech
Our Service Design team listening to Jared Spool’s keynote speech

 

This notion of shared knowledge strikes right to the core of what Alberta Soranzo was talking about during her Keynote speech. By avoiding innovating in isolation, and looking at development at a wider level, it allows the team to grow and develop their skills at a greater rate.

By allowing everyone to benefit from the knowledge gained at events like this, we help cultivate the culture of continuous learning and as the old adage goes, allow the team to become more than the sum of its parts.

What do you think? Do leave a reply below or contact me by email.