Doorknock Dashboard
.png)
Overview
The Institute of Environmental Science and Research (ESR) is the New Zealand government research agency dedicated to the health, wellbeing and safety of Kiwi communities. One of their tasks is to improveNew Zealand’s property market is broken. Home ownership reached a record low of 64% in 2018, and unsurprisingly: we have one of the highest house-price to income ratios in the world. Doorknock cofounders Tim and Luke experienced this frustration first-hand when they started house-hunting a couple of years ago. The lack of affordability was loud and clear, but other problems also came to light when they found themselves squeezing their way through the hallway of a packed open home. For those able to afford a house, there was too high demand and too little supply. Competition was fierce. Developers sat in the pockets of real estate agents and seemed to get first dibs. There was just no hope for young first-home buyers like themselves. They found themselves in a classic ‘there must be a better way’ moment. Which, as often occurs, birthed an idea. Doorknock is a revolutionary early-stage startup that will soon transform how the housing market works (or doesn't work). Maybe you drive past your dream house everyday, patiently waiting for it to go on the market. Soon you won't have to wait, you'll simply be able to go online, type in the address and Doorknock it. You could do the same with entire neighbourhoods if you wish, and the best thing is that all the work will be done by a real estate agent who will out on your behalf to knock on the door and ask the owner if they're thinking about selling.I connected with the Doorknock founders while looking for startups to gain some real-world experience with, pro-bono, straight after I completed my Postgrad in Design. Little did I know I would go on magical a three-month journey working closely with the founders from the foundations of strategy and branding right through to high-fidelity design of their web app. It made the perfect end-to-end project for a junior designer craving some on-the-tools experience.policing, and an offshoot of theirs – Lumi – has certainly done so.
Their patented 'Lumi' or 'Tactiscan' device allows police officers to identify the presence of three different drugs (cocaine, methamphetamine and MDMA) on the spot. This has drastically improved the ability of our frontline police to take suitable next steps, especially in its main use case: when an unidentified substance is found during a search warrant.
The Lumi Nano device has to be connected to a mobile app called Lumi Analysis in order to be utilised, which is operated by the officer on their mobile device. I was tasked with designing a new and improved Lumi Analysis app, doing my best to improve both the UX and UI along the way.
This new app design will soon be rolled out to the New Zealand Police and other police forces globally.
Their patented 'Lumi' or 'Tactiscan' device allows police officers to identify the presence of three different drugs (cocaine, methamphetamine and MDMA) on the spot. This has drastically improved the ability of our frontline police to take suitable next steps, especially in its main use case: when an unidentified substance is found during a search warrant.
The Lumi Nano device has to be connected to a mobile app called Lumi Analysis in order to be utilised, which is operated by the officer on their mobile device. I was tasked with designing a new and improved Lumi Analysis app, doing my best to improve both the UX and UI along the way.
This new app design will soon be rolled out to the New Zealand Police and other police forces globally.
Responsibilities
Foundational user research
Personas
User journeys
Sketches & wireframes
Interactive prototypes
User testing
Personas
User journeys
Sketches & wireframes
Interactive prototypes
User testing
Timeline
April - June 2022
Team
Tim - Founder
Deliverables
Dashboard design for their primary user
User research
In the perfect world, I would have loved to begin this journey with 1-1 interviews with frontline police users about how they fI spoke with 4 real buyers, investors and homeowners in the team’s extended circles. These were people that hadn’t heard of the idea - friends and friends of friends who hadn’t previously been sounding boards for Tim or Luke and were therefore more objective. This was an extremely valuable step which revealed their current pain-points when it came to buying and selling, their initial impressions of the product, their immediate concerns or questions, and their desired functions. It refined our elevator pitch and revealed how we could improve upon the current MVP.ind the current app. However, this wasn't as simple as it sounds, with our police people hot in demand on the ground. If it was possible, it was going to take time to organise.
Instead, I did my best to utilise a recent user survey and the current knowledge of the stakeholders to formulate key personas to base my decision making on and identify any problems and opportunities. In the meantime, the Project Manager approached the Police Service Design Team to discuss the possibility of interviews.
Instead, I did my best to utilise a recent user survey and the current knowledge of the stakeholders to formulate key personas to base my decision making on and identify any problems and opportunities. In the meantime, the Project Manager approached the Police Service Design Team to discuss the possibility of interviews.
User definition
I identified Doorknock’s three main users: buyers, investors and homeowners. Personas, empathy maps, user stories and user journeys brought these groups to life. The work gave the team greater empathy for and clarity about their intended audience, triggered important conversations around what we were doing, why and who for.
The competition
Next, I undertook a mini competitive analysis. As you can imagine, current real estate websites do the job but often lack the personality and thinking that underpins those businesses that everybody knows and loves. We wanted to make Doorknock a household name, a badge of honour. So this analysis identified ways we could differentiate ourselves from the competition through imagery, colour, branding, function and style.
Mapped out the user flows of the entire app, before presenting these to stakeholders. The response was hugely positive, but as always it still sparked important discussions that led to tweaks here and there until we landed on a complete and final flow.
Mapped out the user flows of the entire app, before presenting these to stakeholders. The response was hugely positive, but as always it still sparked important discussions that led to tweaks here and there until we landed on a complete and final flow.
Branding
Doorknock’s previous logo was built in Canva and desperately needed a refresh. Using the information gathered during the research phase, I created a new type-logo that better conveyed Doorknock’s values and positioning in the market, and stood out from the crowd.Using colour psychology and harmony, I identified a balanced colour palette that bravely distinguished the brand from others in the real estate market.Typography choice was key. I identified a type that played well with the logo, was simple and easy to read, and further shaped Doorknock’s character.I presented the new brand identity to the team, using mockups of billboards and posters to illustrate the new look and feel.
User flows
Because Doorknock is a completely new concept, thinking through the information architecture of the website would prove crucial. “Keep it simple, stupid” was my mantra here. We already knew that we could differentiate ourselves from other property sites by following a minimalistic approach, since other sites are often overwhelming and overstimulating. Identifying key user flows helped shape the sitemap. I endeavoured to keep the click count down. We also worked together to decide which features would be included in the first phase of the business and which would be added on later as it grew.
Sketches
I then got to work ideating how each screen could look. I looked to other successful and beautifully-designed websites for inspiration, including those the team had identified as matching the look and feel they were going for.I quickly mocked up my ideas into basic sketches, to get my thoughts down on paper.These sketches were then transformed into wireframes which I bounced off the team. Motivation levels were high as the product began to be pieced together!I then created a low-fidelity clickable prototype using Invision. The prototype was split into user flows for greater clarity.
Mapped out the user flows of the entire app, before presenting these to stakeholders. The response was hugely positive, but as always it still sparked important discussions that led to tweaks here and there until we landed on a complete and final flow.
Mapped out the user flows of the entire app, before presenting these to stakeholders. The response was hugely positive, but as always it still sparked important discussions that led to tweaks here and there until we landed on a complete and final flow.
Hifi
Our users wanted to be able to connect to the Lumi Nano device in two different ways: first and foremost by scTesting the wireframes using interview guides proved invaluable. Using think-aloud, first-impression and single-task testing methods I was able to identify problem areas as well as receive feedback on the information architecture of the marketing pages. In general, the users flowed quite intuitively through the design and I was pleased with the result.anning the QR code located on the back of the device, and secondly by selecting the device from a list of available devices.
User interviews identified that QR code scanning was by far the most popular connection method, hence the more primary focus. However, with a simple swipe up, users can easily select a device from the list.
User interviews identified that QR code scanning was by far the most popular connection method, hence the more primary focus. However, with a simple swipe up, users can easily select a device from the list.
Searchable scan history
Thanks to user interviews we learned exactly how users interact with the scan history tab in order to identify and resend past scan results. This new knowledge led to an overhaul of how the app communicated scan results, and a search bar was added to make the identification process faster.
There's more where that came from.
Check out my other projects today.