Washiewash
Washiewash is a Google Chrome extension to get frequently timed notifications to wash hands. A simple way to maintain hygiene and stay safe.
Timeline
Mar 2020
Platform
Desktop web
Role
Research, UX, UI, Code

01
How it all started
Early March 2020. The number of COVID-19 cases were slowly rising in India. Nationwide lockdown had not been imposed and people were still working out of office spaces. Although everyone knew one of the easiest ways to reduce the spread of the virus was to regularly wash their hands, they somehow seemed to skip the hand hygiene measures quite often. Why? Because hand hygiene, for a lot of us is not a habitual action. Because of which when we're in the zone, immersed in work, we totally forget about it.

Believe it or not, people touch their face 23 times an hour on average, of which 10 touches are to the eyes, nose or mouth - the main pathways that can lead to bacterial or viral infection.
This connection between our hands and our faces makes hand washing the most basic step in personal hygiene. It's even called a "do-it-yourself" vaccine, and the United Nations (UN) has, since 2008, designated October 15 as Global Handwashing Day.

Image credits: Clay Banks on Unsplash
At a time when personal hygiene is more important than ever, best-practice hygiene should form part of everyone's daily habits. That's when I decided to build Washiewash, a widget to remind people to wash their hands frequently. The idea was to help out people working out of office spaces, giving them that extra push to wash hands regularly and properly.
02
Why a Browser Extension?
Most of us put our phones away when at work. I've seen a lot of co-workers putting them in silent mode or keeping them in a desk drawer and checking them only occasionally to make sure they haven't missed any critical calls. Hence for something as critical as hand hygiene, the reliability factor of mobile app notifications were significantly lower.
What else do we use extensively while at work? Web browsers on laptops. Be it Google Sheets, Gmail, Youtube playlist or Notion, we always use browsers for one thing or the other. And extensions work as small software programs that help you customise your browsing experience.

Chrome Web Store
An extension enables you to tailor browser functionality, without diving intensely into native code. Moreover Google Chrome Extensions have amazing multi-device support - syncing chrome extensions across all your personal devices has an inherent advantage and can give you access to all the data that you saved on a particular device across all your other devices. So, I decided to build the widget as a Chrome extension and later publish it to the Chrome Web Store for better accessibility.
03
From idea to design
The concept was fairly straightforward. The extension should help people set timers, with configurable time and keep throwing notifications after the stipulated intervals. Simple. I opened Figma, my favourite prototyping tool and mocked up a basic UI of what I thought would do the job.

'Tis Figma time!
Time for feedback and iterations - I shared my initial prototype with a couple of friends. They suggested a few improvements - one of which was to add a few handwashing tips on the widget. Washing hands with plain soap and plain water kills viruses, but only if it's done thoroughly. This further emphasizes the necessity of spreading knowledge on proper handwashing techniques.

Most people don't wash their hands very well. As silly as it sounds to go watch a YouTube video on handwashing, people should do it to learn how to do it properly - Paul Biddinger, Harvard Chan School
And that made a lot of sense to me. I added a 'tips' section on the widget UI, showing randomised handwashing tips everytime the widget is opened.
04
Design to implementation
This was my first time developing a Chrome extension from scratch, but thanks to Chrome Developer tutorials, they helped me get started in no time. The guides were so well articulated and I never had to refer any external resources throughout the development lifecycle. Trust me, all you need is some HTML, CSS, JavaScript and a basic knowledge of how to add functionality through some of the JavaScript APIs that Chrome exposes.
After a night of hacking stuff together, setting up the manifest, developing the UI, accessing Browser storage and setting alarms, the widget was almost ready.
05
The Launch
After completing a round of testing with friends and family, I released the extension on Chrome Web Store and later, on Product Hunt (Thanks to Neeraj Thakur). Was genuinely surprised by the amazing responses I received from all over.

The wall of love! ❤️
One feedback I received was along the lines of releasing an extended version of the widget, handling multiple other reminder notification scenarios as well. I also realised there would be several other use-cases where this system could be put into use. Hence I decided to open source the project, free for anyone to clone, modify or re-publish. The project is hosted here under MIT License.
As the whole world now stands together, living apart, to battle coronavirus pandemic, it gives me immense joy to find that the Washiewash is playing it's small role to keep people hygienic and motivating them to fight the virus, with hope.
Resources
- Washiewash home page
- Washiewash on Chrome Web Store
- Washiewash on Product Hunt
