Morgan Archer
UX Designer

Digital High Street

Connecting businesses and residents in a COVID world

How do we create a sense of local community without physically interacting?

11 Week project - Prototype, Report & Presentation Deliverables

Lendlease's goal with Digital High St was to design a solution to help connect the residents and retailers of Darling Square during the COVID pandemic and into a Post-COVID world.

  • Digital High St is an App / Multimedia solution designed to encourage community connection and growth.

  • Our target audience included residents of Darling Square, business operators in the local area and a lesser focus on commuters and tourists.

  • A key problem for Lendlease was to help local small businesses in Darling Square connect to with the residents in the area while face to face service and physical interactions had to be scaled back.

  • My work on this project was on a team of UX designers pitching app-based solutions to create this digital community space.

Reconnecting and engaging a supportive digital community

Interviews

In order to gain an understanding of the best ways to engage residents of high-density living in their local community, I interviewed people who currently or previously lived in similar buildings to Darling Square

I utilised attitudinal research methods for this project as we were focused on providing services that would be seen as valuable to residents and business operators, of which I interviewed 5 residents and 2 business operators.

Questions for initial resident interviews were focused on how they interact with their neighbours and businesses nearby already, as well as their experience with Residental social groups.

For business operators, the questions were about their business, how they interact with residents currently and how the way they interact with their customers has changed since COVID

I wanted to get a good idea of what makes a residential social group or service successful. Why people join them and what value they need to see to keep them active. For businesses, I was interested in learning how they engage their customers and what they've tried already.

Insights gathered in the interviews helped me form an idea of what this service needs to be.

  • It needs to be for people in the local community.

  • People want to know their neighbours better, but don’t know how to connect.

  • It needs moderation to keep it healthy.

  • It needs to show that it has a benefit for the user over being 'just another app'.

  • Businesses are open to new ways of engaging the local community.

Direct interview answers from residents of high density buildings

Direct interview answers from residents of high density buildings

Building local community

Surveys

Using surveys conducted online with Google Forms I worked on collecting data on the residents of high-density living in order to better inform what they need.

Based on the results the following insights were gathered:

  • 40% of surveyed people had been living in High-Density apartments for less than 1 year.

  • 90% of people rate the amount they interact with their neighbours as 5 or lower (When asked to rank between 1 & 10).

  • 75% wish to be more involved in their local community.

Assumptions

People want to be more involved with their community.

People find it difficult to find that community.

People want apps and groups to provide value.

Active management of communities is important.

Building local community

Personas

Two personas were created to understand key audiences within the area

Persona 1(Adam) focus:

  • A student operating a start-up in the area

  • Youthful

  • Networking & audience building

  • Hyper-connected

Persona 2(Jackie) focus:

  • Finding new places nearby

  • Connecting with locals and businesses

  • Joining events

  • Finding things that interest them

User Journey

For the use journey, I focused on the 2nd persona Jackie and mapped her morning experience as she moves through Darling Square on her day to day routine

Key points:

  • Jackie was selected as the more general-purpose persona

  • Interview participants were overwhelmingly residents and they were a higher priority audience for the stakeholders

  • The Journey was designed to help identify moments of the day in which Digital High St could improve the community experience for residents

  • Residents have many opportunities for contact with Digital High Street, but also many opportunities for distraction.

  • From this information; I believe a mixed media system that would allow the user to passively engage in the content would drive app engagement.

  • By identifying when users are open to new information but are free(er) of distraction we can select the best ways to engage people to the service.

Building local community

Goals & Concept

Goals:

  • Connecting people with platforms they already may have

  • Showing local services and availability

  • Showing events nearby

  • Prioritising simplicity

  • Leveraging current social platforms

Concept:

A collection of social media services (Facebook, Meetup, Instagram, YouTube) and local screens utilising 1 cohesive brand to engage and connect people

Content shared on each platform can be selected for showcasing on the local screens. this can help bring more people into the community and drive adoption.

Allowing people to organically connect with what is happening around them.

Wallboard view

Wallboard view

Sketches

Wallboard concept

Part of my deliverable recommendations included a wallboard experience to showcase content and engage with people in the local area using Darling Squares' information displays

  • The wallboard concept was designed to allow residents and visitors to experience the cultural value of their community.

  • Research showed that community involvement is key to keeping communities alive; showcasing helps people see the value and engage even passively

  • The walkthrough below shows that an infotainment system can be used to drive engagement with both local businesses and local artists

  • My Journey Map demonstrated that residents are most likely to be able to passively engage with this material while moving around in the area and in elevators.

  • The Info banners allow users to engage further with artists and businesses easily with at their own motivation and pace.

Content rotation on wallboards

Content rotation on wallboards

To the cutting room floor with you!

To the cutting room floor with you!

Wireframes

My first 'more detailed than necessary' wireframe focused on content sharing and location discovery

Key points:

  • Sharing is a focus point, but with deep linking to existing services

    Feedback

  • Key action takes people out of the app

  • UI doesn't make good use of space

  • Difficult to see how the app adds value to users

  • 'What is new'?

More capabilities, more engagement.

More capabilities, more engagement.

Wireframes - Mark 2

For this iteration, I went back to the drawing board and re-created the information hierarchy to focus on what Digital High St can offer than is unique and benefits the user's life.

Key points:

  • User customised & algorithm-driven elements to enhance personalisation

  • Profile system added to enhance socialisation between users

  • Navigation focusing on key access

  • More curated content and local detail

  • Adoption of common local community aspects such as Buy & Sell

    Tools used: Adobe XD

Feedback, Insights & improvements

The Mark 2 wireframe was then tested amongst the team to gather insights before further detail is added

Key focus points:

  • Combined & siloed views for content

  • Content personalisation

  • Emphasis on connecting people

  • Taking the best from existing technologies

  • User customisation

Building local community

UI Design

My intent in the UI design was to keep the content as the focal point.

Key Points:

  • A design that would work in Light/Dark mode was important to me as this now a feature that makes people feel an app is working how they want it too.

  • My design uses elements of Microsofts Metro design language as well as Google's Material Design.

  • The Colour scheme used for Digital High St. current market was scaled back but used as an accent.

  • Content is siloed between the tabs

  • Profiles take users out of the app to their connected services to create connections and reduce overhead.

Content pop-outs

Content pop-outs

Key UI Feature

Pop-Out

  • Posts ‘POP’ out of items in the feed.

    • Making this fun to do encourages interaction

    • The interaction harkens back to Apple's 3D Press UI

  • Keeping the UI minimal helps keep content and people the focus

  • Content items always float above the rest of the UI

  • This causes a visceral interaction between the user and the content.

  • It is PUSHED towards the user, filling the screen, focusing attention and PULLS back when returning.

  • This segmenting of the UI helps the user maintain their bearing within the app.

Final words

Summation

2 Pillar solution: An App & local visual solution.

  • App to connect people and create a sense of local community.

  • Outdoor visual showcasing to engage the community while creating a tangible benefit for uses who engage and share content.

If you're interested in more details about the deeper app experience, I'm happy to provide my final presentation for detail on each screen.

Using this two-pillar approach, members of the community who are unaware of Digital High St will be able to feel the effects by just being in the space. While those who engage with it are able to showcase their work and businesses to those in the local community.