About

First of all, I’m super-proud to have had the opportunity to lead the UX team who designed the NHS Covid-19 app - remotely. The National Health Service (NHS) is the umbrella term for the publicly-funded healthcare systems of the United Kingdom (UK). NHS Covid-19 app was the technologic response to the coronavirus crisis, an app which can tell its users if they were near someone infected, report coronavirus symptoms, give the specific advice, check in to different venues, and other useful information.

Even though NHS is one of the most appreciated brands in the UK, we quickly learned that a large portion of the potential user base will be reluctant to use the app, due to privacy concerns and confusion between NHS and the UK government - which was one of the main UX challenges on this project. To protect the users' privacy, the NHS Covid-19 app was built using Google and Apple contact tracing technology, which would keep the users anonymous. In a nutshell, the app is exchanging anonymous keys, and keep them for 14 days locally on the user’s device. If a user is infected, they can share their status with their contacts, who, as result, will receive specific advise - everything is anonymous.

If you want to find more about the app, please see the video below:

My (usual) UX process

If you know me, read my previous posts or case studies, you already know that I'm a huge fan of Design Thinking framework and Lean (UX) methodology - which I apply not only in UX projects but also in my day to day life. Each project will have its particularities, and it will require different methods and techniques, but the foundation is still the same. The image below is a good reminder of the Design Thinking framework process.

Understand the users

I led my UX team through the process, starting with the "Empathise" phase. We've kicked off by conducting user interviews and we’ve also engaged with NHS behavioural team to get a hold on any relevant data from previous user research initiatives. To be effective, this app needs to be used by as many users as possible, so that the data is more reliable. Due to the extra-large targeted user base - which was 80% of UK smartphone users, 56% of UK’s population which is roughly 37 million users (Woooow!!!) we’ve conducted interview sessions with sets of users from different demographics - BEM, LGBT, users with accessibility needs, and other communities etc.

During the research phase, we’ve benefited from interesting findings, which helped us design a much better the app.

A few of the learnings:

• High percentage of users from some communities, don’t trust the government and thought that the app would be a tool for controlling their lives, therefore they didn’t plan to use the app at all.
• Nurses, doctors, teachers, supermarket till employees, will have to turn off their phones because they were already protected by the Personal Protective Equipment (PPE).
• There was a high level of interest from users with accessibility needs, as they felt more vulnerable
• A high percentage of users were concerned about privacy, and location tracking
• Many users which were self-employed, were concerned that once told to isolate they won’t be able to maintain a continuous cash-flow.

Define

We’ve analysed the learnings, and we came up with several personas for the users we thought are critical and representing a significant cohort. Very similar to Agile user stories, we’ve used "Point of view" (POV) activity to define the design challenge for the main personas. We’ve also conducted several user story mapping sessions which helped us to consider, discuss and prioritise different ideas and concepts and created storyboards, to visualise more vividly the user scenarios. All those exercises helped the product team make user-centric decisions in regards to the product roadmap and priorities.

The main features for the MVP version of the app were: Onboarding, Reports symptoms, Isolation notification and countdown, Venue check-in, Toggle contact tracing on and off, About the app, and Manage your data.

Ideate

Equipped with all this new knowledge, documented in Miro boards, we had several workshops with our colleagues from different teams (Three amigos) - Technical, Product, Legal & Compliance, Accessibility, Research and others, to ideate on the design hypothesis. The aim was to create a shared understanding and co-design low fidelity representations of the prioritised user flows.

Wireframing and Prototyping

Having a good base for the potential design solutions, the core UX team took the wireframes to the next level and designed the user flows in higher fidelity and build “clickable” prototypes, so we can test the hypothesis as early as possible, with real users.

Test hypothesis

We’ve conducted a few rounds of user testing, which revealed mainly minor issues, which we address in the next design iterations. We observed that one major issue was still persistent though. It was the users’ reluctancy of using the app due to the false impression that the “Government” will track them, even though during the onboarding process and throughout the app, we made it very clear, that they are completely anonymous and the app doesn’t know their location. We felt that this issue needed to be addressed before the user is downloading the app, through marketing material via different channels. Our colleagues from marketing done an awesome job, in creating awareness in an easy way, of how this app works.

Takeaways

Pfewwww… This is by far the most complex project I ever been on, and it definitely pushed me to grow even more - but it was awesome and I’m 120% grateful for this! Besides the usual complexity, having to do everything remotely added even more weight. This required super well-planned and organised workshops, even better collaboration and communication, a clear vision for the team, mutually agreed "ways of working" and being able to motivate and lead the team towards success. This project set up a very high stake in terms of professional challenges, and I’m looking forward to the next one.

PS

I apologise to all the processes I haven’t mentioned in the looooooong post - competitor analysis, expert reviews, UX team retrospectives, technical reviews, accessibility reviews and more - but you know who you are, and how helpful you've been in making this app better :D

About

HSBC is the largest bank in Europe (including the UK) and the 6th largest banks worldwide. Part of their digital transformation initiative was to create a brand new app for their 1.5 million customers to replace the current app which had a low App Store score, of 1.9 stars - at that time. The new app had to work for each country HSBC had a presence in, therefore, localisation and customizability were the heart of the design process.

See below how I managed to lead the UX team which contributed to increasing the App Store ratings for 1.9 stars to 4.8 stars from 879K reviews and support a customer base increase form 1.5M to more than 6M customers.

To learn more about the app, please see the video below:

My UX process

Lean UX is more of a mindset of teams collaboration and reduced waste, which works great in an Agile environment, to create a Minimum Viable Product (MVP) with as little effort as possible, and continuously evolving through small iterations based on user research.

During this case study, you’ll see a summary of how I applied these processes on the HSBC project.

Understanding the problem (Empathise)

In order to make sure I’m solving the right problem, I started with understanding the business goals and objectives. To do so, I conducted stakeholders interviews and organised workshops with the relevant stakeholders, in order to learn as much as possible about the business, how it's done, what problem it's trying to solve, who are the users and what pains & goals do they have. Also, I gain better insight on how the teams are structured and the existence of previous design documentation like design systems, components library etc.

We’ve summarised the business discovery workshops with 5 key improvement points:

1. Stability
2. Speed
3. Delivery frequency
4. Better user experience
5. User interface design

As a reminder, at that time, the current app had a poor user experience which reflected in the App Store ratings 1.9 stars, creating reputational damage for HSBC.

To have a deep understanding of the users, their goals and motivations and more importantly their pains, we’ve conducted several user interviews and a usability testing session of the previous app.

Problem statement (Define)

Due to the high number of different personas, we’ve chosen to focus on “Jobs-to-be-done”, therefore, based on the previous interviews we’ve identified which are the key journeys and we’ve created a customer journey map of how the users behave to achieve their goals, and how do they feel at certain points in the journey.

We’ve also conducted competitor analysis to understand the market better, and how our competitors solved similar issues. After this initial discovery phase, the UX findings informed the product vision and helped stakeholders to prioritise the roadmap.

Co-designing (Ideate)

Once we had the roadmap defined, we started to apply the UX process on each feature. We kicked off with improving the logon flow, which was lengthy and complex. After a round of usability testing and user interviews, we learned that some of the users found the logon form way too complex with too many details to input. We’ve also found that a high percentage of the users, were logging on just to check their account balance.

Armed with all those findings, I conducted a three amigo workshop, involving the technical leads, architects, BAs, PO and fellow designers, to co-design an improved login flow.

The outcome of the whiteboarding session was a low fidelity user flow screen diagram, and a much better shared understanding across the cross-functional team. We took the new user flow diagram and we’ve continued evolving the designs within the UX team and involving other teams like copy, accessibility, and legal & compliance teams.

Prototype and test

Once we were confident that the new hypothesis is solving the previous issues and it’s feasible, we’ve created a low fidelity prototype and we guerrilla test it with 8 participants. All the 8 users appreciated the new log on flow and also the new “Fast balance” feature (ability to check the balance without logging on) which emerged from the users' interviews. We continued with high fidelity designs, following and improving the HSBC design system.

Along with designing the next features on the roadmap, we’ve always worked together with the dev team to support the development process. We provided visual assets, review and paired with our technical colleagues, to make sure that the app behaves and looks as designed.

User feedback and iterate

We continued designing the agreed MVP features - accounts summary, account details, make a payment, create new payee, settings, and chat, following the same UX process - discovery, co-design (three amigos workshops), low/high fidelity prototypes, user testing, dev support, feedback gathering, iterate.

All the mentioned features were subject to Alpha release. The targeted audience for Alpha release was 50k users, from who we collected feedback in order to improve the app even further.

Takeaways

Even though ideally a designer would strictly follow the UX process, sometimes, due to certain limitations we can't do it by the book. Sometimes those limitations could be budgets, deadlines or even stakeholders. As a UX designer, it's very important to overcome those limitations and find a way to involve the users in the designing process. Know your users inside-out, facilitate design collaboration involving different disciplines, validate your designs with users, fail quick and cheap, and add value through iterations.

About the project

Smarock Classroom is a mobile app running on iPads and Macs, which helps students receiving the best learning experience, as it empowers a custom learning plan for each student level: curriculum, testing and homework.

The app has four major user types: students, teachers, the school management team members and parents. In a nutshell, the school management team can manage years, classes, teachers, students, schedules and many more.

The teachers can then create or co-create, share, or import lectures to classes, test, provide homework or different types of in-lecture questions and tests.

For students (and parents) some of the main benefits are the custom learning plan, individual progress tracking, level assignment, reminders, easy access to teachers via chat and many more.

The UX process

I started the UX process conducting stakeholders interview to better understand the product’s vision and goals. I’ve learned which are the business drivers and how success is measured, who are the users and what are their pains and goals. In order to have a better understanding of the users, I conducted several remote interviews with each of the main user types.

Even though there are a few competitors like Google classroom, Classroom from Apple or Blackboard, the aim was to build a more advanced tool, therefore lots of the patterns I came up with didn’t have any other inspiration source than user research.

Due to a large number of personas for each user type, I found it suitable to focus on the “Jobs to be done”. To come up with the main user journeys, I conducted a user story mapping session in order to better visualise how the product roadmap will look like and to prioritise delivery in “Now, Next and Later” phases.

We agreed that the MVP version of the app would contain features like registration, login, lesson creation, schedule, in lesson, annotation, homework and lesson history.

Each feature followed roughly the same UX process. Understanding the users' expectations in the context of the feature, ideation (along with stakeholders, devs and other disciplines), low fidelity prototypes and user testing. Involving developers in the designing process (three amigos sessions) avoids waste generated the feasibility issues.

After the user validation and UX improvements, I continued with the UI design and further rounds of user testing. Obviously, this is an iterative process and sometimes, the methods and techniques can be slightly different, based on the most suitable solution.

Takeaways

Even in a remote context, collaborating closely with other disciplines in the design process, allows the designer to consider a wider variety of solutions, stakeholders alignment and avoid feasibility issues.

About the project

The aim of the project was to test a business proposition in the asian market - a banking web app (with the prospect of a mobile app) for small businesses which allowed the users to send, spend and save like a local business.

Following Lean Start-up methodologies, the cheapest way to test was a high-fidelity prototype (MVP) which could be put in front of real users. The other use of the outcome was to be presented to investors, which were willing to contribute financially to turning it into a real product.

Kicking off

I started with a one-day kick-off session, where the several stakeholders talked me through the product vision, the business goals, assumptions and hypothesis, and the research they’ve done so far. Based on my new understanding, I rapidly created several proto personas which I have validated with the stakeholders and conducted competitor analysis.

With the new understanding of the users and what other competitors are doing (or not doing) to solve users’ problems, I conducted an ideation session using Crazy Eights, involving participants from different disciplines. The outcome of the workshop was paper sketches user flow diagrams, for all the journeys based on the personas and the business goals.

Wireframing and prototyping

The next step was to digitalise and evolve those paper sketches user flow diagrams into low fidelity wireframes and then high fidelity designs and prototypes, aligned with the company’s design styleguide.

With each iteration in the process, I have involved stakeholders, through co-creation or review sessions.

User testing

After testing the prototype with 8 participants,I’ve learned that the users would appreciate the existing features. Along with minor improvements which would improve the overall user experience, several of them suggested some extra functionality like integrating with existing accounting apps, investing recommendations and future projections.

Of course, the project’s budget influences the UX process. Regardless of the budget, always make sure you find a way to understand and involve the users in your UX process. This can be achieved through cost-effective methods, like user interviews, Guerrilla testing, proto personas and many more. This will allow you to come up with solutions for real users’ problems. Even more, sometimes the users can suggest great ideas which can be validated further.