HARBOUR NEIGHBOUR a community powered mutual support design
Design Proposal Report Yushi Yang 470150056
INTRODUCTION
E
mergency response has been a topical and focal issue, especially with people’s increasing awareness of climate change and direct experiences of all kinds of emergencies, either natural or man-made, personal or public, local or global. For average people, on a daily basis, how to get well prepared for, respond swiftly and properly, and recover as soon as possible from emergency situations proves a crucial issue. Based on the preceding user-centered research and further literature review, several major issues have been focused. Such issues include accommodating broader user groups, especially vulnerable ones, constructing a wellstructured and efficient model of a community-based system, and effectively motivating neighbourhood participation in emergency response. Working on the above issues, the design work targets a community-based cross-channel & multi-modal emergency response scheme. In order to provide services for users as extensive as possible, flexible choices are presented in terms of both channels and modes to cater for users’ physical mobile and cognitive ability and media use habits. A cross-channel community-based model is adopted to collaboratively offer synchronized but less redundant communication in the hope to ensure the effectiveness and efficiency of the system. Tangible materials and digital ones are linked but can also function independently up to their own capacity. What’s more, playing crucial roles in encouraging people’s participation, media contents are designed, with reference to the basic phases of emergency response, to help get users prepared on everyday practices as well as to offer instant information on emergency occasions. The design work has adopted iterative approaches. The general process is depicted as follows. •
Yushi Yang
yyan2194
DESIGN PROCESS SUMMARY Rapid Prototyping—Iteration Phase I (with 6 initial concepts) Prototyping method: Ideation + Sketchy prototyping
Design
Analysis
Research
Review
User testing method: Lateral thinking/Group discussion Number of testers: 6
Evolutionary Prototyping +
Background Research
Critical analysis
User Research
User needs generation
Iteration Phase II (with selected concepts)
Further Research Testing
Testing
A Refining Iterative Process Testing Testing
Feedbacks Feedbacks Grow
Testing
Feedbacks
Grow
Ana ly desi sis+ gn
Iteration phase I
Rapid Prototyping
A +d naly es sis ig n
Iteration phase II
Iteration phase III
Evolutionary Prototyping
Testings
To Final Version
Iteration Phase III (with a revised concept)
Task 1
Task 1
Prototyping method: Paper prototyping
Prototyping method: Paper prototyping
User testing method: Think aloud protocol
User testing method: Think aloud protocol
Number of testers: 2
Number of testers: 2
Task 2
Task 2
Prototyping methods: Storyboard+Paper prototyping
Prototyping methods: Storyboard+Paper prototyping
User testing method: Think aloud protocol
User testing method: Think aloud protocol
Number of testers: 2
Number of testers: 2
Task 3
Task 3
Prototyping methods: Storyboard+Paper prototyping
Prototyping methods: Storyboard+Paper prototyping
User testing method: Think aloud protocol
User testing method: Think aloud protocol
Number of testers: 2
Number of testers: 2 User testing method: Post-experience questionnaires Number of respondents: 7 Yushi Yang
yyan2194
BACKGROUND RESEARCH
User needs summary From the preceding user-centred research, the following needs have been identified
Target users Individuals or households from the same neighbourhoods
Expectation for and enthusiasm about participation in emergency response -Real-time & real-place participation -Prompt assistance in immediate area
Diversity of media use
Community property management personnels
-Multi-media supported -A combination of online and offline spaces
Community based emergency scheme -Enhancement of neighbourhood ties
Particularly, the vulnerable groups in emergencies and conventional media users will be addressed in the design.
Yushi Yang
yyan2194
BACKGROUND RESEARCH Key Findings of the User-Centred Research
Further Research Topics
• Digital-media-only is not
enough to cater for wider scope of user groups and media using habits.
• Community• Digital-Physical
• Community bond is generally
aloof, despite of extensive use of digital media and close juxtaposition of residence.
Integration Scheme
based interactive design
• Emergency • General response • Initiative and enthusiasm are identified, although limited contribution is reported to have been made previously.
cycle
principles for interactive design
Yushi Yang
yyan2194
FURTHER RESEARCH There is an increasing awareness of the critical importance of building neighbourhood relationships for community resilience. Major approaches or media: Worldwide, researches, projects, campaigns , even local or national governmental schemes aim to promote community emergency response by strengthening neighbourhood ties.
• Australia Neighbour Day campaign
Image source: neighbourday.org
• Neighbourhood Liaison Program
Image source: Redwoodcity.org
• Building neighbourhood social • Neighbours helping resilience project
neighbours program
“ A growing number of cities and countries are taking steps to transform their residents from victims to active partners with local government in emergency preparedness, planning and response.
—Institute of Local Government of City of Palo Alto, California, U.S.A. “Experts who respond to emergencies say relationshipbuilding before an event is a key to helping communities to cope with tragedy.” — John Davis
Image source: vancouver.ca
1. Offline activities and events (parties, games, outdoor movie show, etc.
2. Conversation board for sharing information or life hacks
3. Neighbourhood social groups via application for general public
4. Websites to provide suggestions and plans
Image source: ready.com
Critical thinking: Basically, most of the approaches to enhance neighbourhood bond for emergency response can be described as physical. An organically integrated system combining different media and targeting particularly to emergency response is rarely seen. In such an age of high digital-technology-dependence, how to make full use of digital materials together with tangible ones is of crucial importance. Yushi Yang
yyan2194
There are trends of multi-modal and cross-channel design in interaction. Multi-modality
Multi-media
Cross-channel
V.S.
• Multimodal interaction
provides the user with multiple modes of interacting with a system
Multi-channel
V.S.
• An interactive system, that
provides information via several output channels and offers several devices for user input
‘A well-designed multimodal application can be used by people with a wide variety of impairment or situationally impaired.‘
—Holly.S Vitense
• To accomplish a task, people could jump between channels to take advantages of the strengths and of particular functions of different channels.
•
To accomplish a task, there are various channels for people to choose from start to finish
‘Seamless, cross-channel experiences are the way of the future, as technology fades into the background and the personal, physical, and social context determine the methods we use to interact with information.’ —Tyler Tate
Critical thinking: The entire journey of emergency response involves a variety of activities through different channels and involves an extended user groups and contexts. Effectiveness and efficiency of the designed work and its broadest usability should be given particular consideration. Yushi Yang
yyan2194
Preparedness is generally considered crucial in efficient and effective emergency response. However, relevant researches and surveys show that the situation is far from satisfactory and lack of knowledge, skills and supplements is one of the prime barriers in this case.
•
FEMA’s Four-phase Emergency management cycle
New Zealand Disaster Preparedness Survey 2018
United States Household Survey Results on Individual and Community Preparedness 2018
Image source: community.fema.gov The key to reducing loss of life, personal injuries, and damage from natural
disasters is widespread public awareness and education. People must be made
aware of what natural hazards they are likely to face in their own communities. They should know in advance what specific preparations to make before an event, what to do during a hurricane, earthquake, flood, fire, or other likely event, and what actions to take in its aftermath.
Image source: civildefense.govt.nz
Image source: community.fema.gov
——Richard E. Hallgren.
Critical thinking: A community-based emergency response scheme could play a role in neighbourhood emergency management. In developing the contents of the scheme, the lifecycle of emergency management may function as a guidance. Particularly, helping community members get prepared for emergencies via cross-channel and multimodal facilities should be made an important and routine work. Yushi Yang
yyan2194
General principles for interaction design ‘People interpret the world
‘When working on UI design, to increase
Apply Fitts’s Law* to interactive elements
the efficiency of an interaction, try to not only reduce distances and increase target sizes, but also reduce the total number of targets that users must interact with to complete a given task.’ — Nick Babich
Make it comfortable to interact with a product
Reduce cognitive load
Promote visual clarity
Protect user’s work and information
Functional Consistency
Digital Make user interfaces consistent
Reduce the number of actions required to complete a task
Create community through shared experiences
Keep it simple and stupid
Physical
Design accessible interface/ system Place users in control of the interface
Visual consistency
Eliminate all elements that are not helping your users
Make actions reversible Create an easy-tonavigate interface
Accomodate users with different skill levels
based on their context, a
Think about the users and environment
physical experience is no different. It’s important to take into account the spaces and environments that bookend an
Enable community connection
experience.’ —Ripen Deleon
Give-andtake rewarding relationship
Engage all the senses change overtime occupy space
Meet people where they are
Fitts’s Law* states that the time to acquire a target is a function of the distance to and size of the target. This means that it’s better to design large targets for important functions (big buttons are easier to interact with).
Yushi Yang
yyan2194
Persona type: Virtuous kind strong mum Name: Jenny Occupation: Restaurant manager Age: 39 Family members: A young kid đ&#x;‘Ś and an elderly mum đ&#x;‘ľ Gender: Female
PERSONAS
Persona type: Popular wise elder Name: Mr. Wong Occupation: Retired high school headmaster đ&#x;Ž“ Age: 68 Gender: Male
Backstory: Wong is a retired high school headmaster who enjoys a good reputation among his colleagues and community friends. He goes to the community park on wheel chair to play chess with several old friends who live in the same neighbourhood. Although there is no more teaching burden, he never stops thinking actively and is willing to embrace new things. Motivations: ‣ To try new technology ‣ To get actively involved in the neighbourhoods ‣ To contribute to community emergency response ‣ To take care of each other
Frustrations: ‣ Connection gaps between different age groups ‣ New technology challenge to him and his elder friends ‣ Poor eye visions and needs to be taken care of due to relatively poor health condition
Ideal experience/goals/aspirations/feelings: ‣ A designed physical gathering spot where people in the community can meet offline and share information on a daily basis. ‣ A more user-friendly application interface for the elderly on the smartphone. For example, larger and more simple buttons; reduced steps of finishing a task. ‣ A more mixed interactivity among different age groups in the community. ‣ Share and learn life experiences from neighbourhood friends.
Backstory: ‣ Jenny is a single mum who lives with her 8-year-old kid and her mother who has a poor health condition. She goes to work early in the morning and returns home late in the evening. Due to this situation, she prepares the food for the whole family the night before. She has no complain about her tough life but she really worries about her mother and son.
Motivation: ‣ To get prompt notification of her family when she is away ‣ To get immediate help from neighbours on emergency occasions ‣ To share her recipes and cooking skills in return ‣ To learn practical emergency skills Frustrations: ‣ Challenges for mother and son to use smart devices ‣ Some reluctance to review family situation ‣ Lack of confidence of her own sharing Ideal experience/goals/aspirations/feelings: ‣ An easy-to-operate terminal for her mother to understand and use. ‣ More health information about senior care and child care from the experienced ones in her community. ‣ A stronger connection among neighbours who can offer immediate help. Quote:
Quote:
‘ Although I am a retired old fellow, I can still feel something running energetically in my bloodstream. I realise my main battlefield has shifted to the neighbourhood. I would like to take an active part in the community life and stay connected to my community friends.’ Image source: https://uyghuramerican.org/article/chinas-great-famine-true-story.html
‘Basically, I sacrificed my personal life in order to take care of my mother who is unwell and my little kid. It was the right thing to do. Besides, I have a restaurant to operate, where all the restaurant employees depend on me. I really wish someone who live nearby can help me to keep an eye on my family while I am absent.’ Yushi Yang
yyan2194
Image source: https://www.masterfile.com/search/en/middle+aged+chinese+housewife
SYSTEM REQUIREMENTS & CONSTRAINTS
System Requirements
Constraints
• Minimum requirement of user’s physical, mobile, cognitive abilities
• Reliable neighbourhood
intranet around the clock
• Operational requirement
especially vulnerable groups.
alternatives for users to interact with
• Database constraints
It takes long time to gather geolocation of neighbours and verify personal information
• Facing all types of users, • Providing multiple
• Technical Constraints
Data connection among three parts of the system (digital app, physical hub, hint smart band)
24h
• Maintainability requirement
Online network and offline physical hub need regular maintenance
• Business Constraints • Budgets
• High requirement for the built environment in the neighbourhood
• Open space to set up the physical facilities
• Several spots to set up
multiple the facility to cover certain radius of residents
• Strong community bond
Research and development of the system; Realisation of products; Maintenance administration and support fee;...
• Schedule mandates
• Material Constraints
• Surface material
User friendly surface materials
• Structural material
Robust and solid physical structure
• Regulatory Constraints • Legal content
• Safety requirement User information protection
Yushi Yang
yyan2194
RAPID PROTOTYPING — ITERATION PHASE I Main goal
Identified Needs via User Feedbacks
A neighbourhood mutual-aid emergency response system
• Not proper for sake of • Not necessary for a new security and privacy
shelter to be established
Initial Concepts Community-based intra-network
Participation
User data collection
• Necessary or desirable
Virtual+Physical Scheme
As broad user groups as possible
Gathering space
Minimal operation device for vulnerable groups Add modes such as voice, visual, audio,... Security and privacy protection Cost-effective Yushi Yang
yyan2194
EVOLUTIONARY PROTOTYPING — ITERATION PHASE II Content Design
Structure Design Cross-channel design
As
Virtual+Physical Scheme
Community-based intra-network
On daily basis
Emergency
Further Needs Identified Clearer and more simple user interface • Offline physical facilities
Multimodal design
For
• Online digital application
• Electronic device
As broad user groups as possible
Home page
• Neighbourhood events • Neighbourhood news
Emergency notification page
• Location map • Help seeker information • Supplement information
Emergency report page
• Emergency types • Report emergency
More direct and efficient notification Allow multiple media uploading options More personalised design
Modes
Accessibility of physical facility Portability of electronic device
Physical supplement hub in the community with touch screen
Keypad and supplement drawer of the physical supply hub
Yushi Yang
yyan2194
EVOLUTIONARY PROTOTYPING — ITERATION PHASE III Streamlined app interface
Home page • New user notification
• Neighbourhood news& events • Life experience sharing columns • User profile page
Visual and audio effects for more direct notification
Emergency notification page
• Large Location map • Help seeker information • Supplement information
More modes for wider users and contexts
Emergency report page
• Emergency type fast selection • Report emergency • ‘000’
Emergency mode: Colour Red
Accessible physical hub design
Daily mode: Colour Blue
Wearable electronic device
Yushi Yang
yyan2194
Structural Model
Content Design Example — Get Prepared
• Cross-channel • Multi-model ‣A
cross-channel community-based model is adopted t o o ff e r s y n c h ro n i s e d b u t l e s s re d u n d a n t communication in the hope to ensure the effectiveness and efficiency of the system.
• Scheduled community emergency drill
‣ Tangible materials and digital ones are linked but also function independently up to their own capacity.
i Electron c device
Online digital app
Offline physical facility
• Online emergency skills training
• Collecting and making emergency plan
Yushi Yang
yyan2194
USER TESTING —TASK 1 Share one of your life hack tips to the neighbourhood with Prototype 2.0 Interface part/Location
Verbal Protocol
Strengths
Weaknesses
Home page
I’ll click the POST HERE button
Easy to locate the button
—
Life hack post page -brief introduction -category selection
1. ‘The brief intro is easy 10 minutes quarantine meal’ 1. Simple and clear steps to introduce 2. ‘emmm..... I’m not sure which category I should select. your topic Emergency? Or cooking and recipe? Maybe there can be 2. Multiple category selections a more accurate option.’
The category is not concise and accurate enough to meet each and different content from users
Photo upload page
1. 2. 3. 4. 5.
1. No video upload option 2. No maximum file size 3. No limitation of file numbers
Upload successful notification Return to home page
Virtual user testing via Zoom. Meeting conducted and recorded on May 10th.
Yushi Yang
yyan2194
‘How many photos can I upload one time?’ ‘Can I upload videos?’ ‘What’s the maximum media size?’ Click on 4 photos Tao upload button
1. I have successfully uploaded my photos 2. Click on RETURE HOME
1. Clear thumbnails of photos from user’s smartphone 2. Easy to upload
Easy to locate the button
—
1. Can I see my post and how my neighbours think about it? One can see his or her ranking changes So far, people are not able to see the status of the 2. Oh my ranking is up! in the neighbourhood post.
Inspirations Keep the exiting style and arrangement 1. Develop major group title and related subgroups for easier selections. 2. Create simple logos for each category for easier recognition. 1. Enable photo and video upload options 2. Limited size and numbers of media to ensure a simple and fluent interface experience Keep the exiting style and arrangement Enable a window to check the status of people’s post. Like, share or subscribe.
USER TESTING —TASK 1 Share one of your life hack tips to the neighbourhood with Prototype 3.0 Interface part/Location
Verbal Protocol
Strengths
Potential Future Improvement
Home page (Neighbourhood news & events neighbourhood life hack sharing)
I’ll click the POST HERE button
Easy to locate the button
Keep the exiting style and arrangement
Life hack post page -brief introduction -category selection
1. ‘The brief intro is easy 10 minutes quarantine meal’ 1. Simple and clear steps to introduce your topic 2. Clicked on Food&Recipe. ‘ It’s easy to choose one category.’ 2. Multiple category selections
Photo upload page
1. Selected 5 photos and 1 video 2. Pressed upload button
Upload successful notification Return to home page (Neighbourhood news & events neighbourhood life hack sharing)
1. I have successfully uploaded my photos 2. Click on RETURE HOME 1. Can I see my post and how my neighbours think about it? 2. Oh my ranking is up!
1. Clear thumbnails of photos and videos 2. Easy to upload 3. Limitation for media sizes and numbers
1.Keep the exiting style and arrangement 2. Further research should be conducted to include more specific categories to select from Keep the exiting style and arrangement
Easy to locate the button
Keep the exiting style and arrangement
One can see his or her ranking changes in the neighbourhood
Enable a window to check the status of people’s post. Like, share or subscribe.
USER TESTING —TASK 2 To get emergency supplement via Prototype 2.0 Interface part/Location Home page (Change from everyday mode to emergency mode)
Emergency information page
Supplement checklist & locations
Passcode
Get the supplement
Verbal Protocol
Strengths
Weaknesses
Oh... the interface changed from blue to red when emergency happens in my neighbourhood
Immediate colour code changes to raise the awareness of neighbours in the community
It may not work if the user is not using his smartphone at the moment.
Alternatives to report emergency issues should be considered: wearable gadgets/physical community kiosk...
1. The colour red does raise the awareness of emergency issues. 2. Quickly shows geographical distance between you and the help seeker 3. Quickly shows the type of emergency
1. The interface is too complicated with no clear emphasis 2. Privacy issue is a crucial problem. Personal information should be protected 3. Confusing steps like ‘what do you need?’ 4. No hierarchy
1. ‘Should be checklist not what do you need right?’ It’s good to show the checklist here. I can check if there is any at home first.’ 2. ‘I can see the location of the nearest hub. I clicked on the spot but nothing shows. It’s a bit confusing.’ 3. ‘I clicked on offer help. Will the help seeker receive my message?’
1. Clear structured steps 2. Clear location maps
1. No detailed information after clicking each hub on the map 2. The message does not reach the help seeker
1. Be precise; create an interface with hierarchy; introduce floating windows. 2. Create different map style to respond different residential types. Enable zoom-in and zoom-out functions. 3. User information should be coded and information of help seekers can only be accessed during emergency period. 4. Change ‘What do you need” to ‘ Check the first aid supplement’
1. ‘I can see my code 635’ 2. ‘This is the nearest route to the hub, I will follow it.’ 3. ‘What if someone receives the code earlier than me?’
1. Clear and simple passcode 2. Clear location map
1. ‘ This map doesn’t match my type of residence. I live in an apartment. This seems like bunch of single-detached dwellings. 2. ‘ Is it safe to show the unit number to everyone?’ 3. ‘ What do I need? I don’t really understand.’ Clicked on the button to see what do you need.
1. Enter the code on the keypad 2. Take the supplement from the specific drawer
Virtual user testing via Zoom. Meeting conducted and recorded on May 12th.
Yushi Yang
yyan2194
1.Easy manual put-in 2. Automatic allocations
High possibility of repetitive code distributions to multiple helpers 1. No simple instruction diagrams on the machine. 2. Power off condition?
Inspiration
1. List the supplement in the first section 2. Design floating windows to show the details of the hub (status of the supply; number of respondents...) 3. Send the notification to the help seeker; He or she can see the number of respondents. Clearly show the status: the code has sent to.../someone is heading to the supply hub/... Put simple and easy-to-read instruction alongside the machine and keypad
USER TESTING —TASK 2 To get emergency supplement via Prototype 3.0 Interface part/Location Home page (Change from everyday mode to emergency mode)
Emergency information page
Supplement checklist & locations
Passcode
Showing the route
Take the supplement
Verbal Protocol
Strengths
1.‘Oh there is an emergency issue in our neighbourhood!’ 2. Tapped code to see the detail
1. 2. 3. 4.
1. ‘Mr Chong is in need of help right now.’ 2. ‘I’ll not share his personal information to others is there is no emergency.’ 3. Clicked on Check the supplement
1. The colour red does raise the awareness of emergency issues. 2. Provide basic information of the help seeker to the heroes 3. Special notice to remind people of privacy protection
1. I need ...,... and .... for the emergency 2. Tapped the code to see details of the supplement
1. Clearly shows what are needed for the emergency. One can check if there is any at home first 2. Clear location map showing the distance of the sully hub 3. Enable zoom-in and zoom-out functions
1. 2. 3. 4.
1. 2. 3. 4.
‘I can see my code 1347.’ ‘This is the nearest route to the hub, I will follow it.’ ‘No one has claimed the supplement. I will take it.” Pressed the button to send help message to the help seeker
Immediate colour code changes to raise the awareness of neighbours in the community Use code to protect help seeker’s privacy Quickly shows geographical distance between you and the help seeker Clearly shows the type of emergency
Clearly shows the status of the supplement Clear location map to zoom in and out Clear and simple passcode Inform the help seeker at once
Potential Future Improvement Add sound and vibration notification in the case of emergency
Further technical solution to help protect user information
Add images of the supplement
Read aloud the passcode
1. ‘First I should go to the hub and then go to his place’ 2. The route is very clear
1.Clearly shows the steps 2. Enable zoom in and zoom out
Enable audio navigation
1. Enter the passcode 2. Pressed 1,3,4,7 3. Took supplement from drawer E07
1. Simple 2 steps to get the supplement 2. Clear and large notepad to press
Enable audio instruction
1 3 4 7
1 3 4 7
USER TESTING —TASK 3 To seek for help during emergency via Prototype 2.0 Interface part/Location Home page (New user instructions in emergency situations)
Emergency type selection page
Send help via ‘HIT‘
Verbal Protocol
Strengths
Weaknesses
‘I think it is not obvious enough to see the new user notice. It might be too small.’
Introduce emergency mode and how to seek for help at the beginning of the application.
Not significant enough. Too small to recognise.
yyan2194
Use one page or a floating window to display the message and instruction to enhance the significance
1. Too complicated 1. ‘Well, i think its too complicated for me to select the type. It’s too specific. I can imagine 2. No hierarchy of it’s likely like I don’t have the time to read through each word when emergency comes. emergency types 1. Immediate Colour change from It should be as simple as possible.’ 3. No following-up light blue to red to make the 2. ‘ I reckon household emergencies are the most common emergencies in the selections options more recognisable. neighbourhood. It’s too behind to see.’ 4. No option for ‘000’ call 3. ‘ What if i don’t have my smartphone with me when emergency strikes?’ in case of severe emergencies
1. Be simple as possible: sudden injuries/ household emergency/call triple 000 2. Create sub types after selection( floating windows or next page) 3. Enable emergency report functions 4. Alternative methods to report an emergency should be considered
1. 2. 3. 4.
1. Write simple instruction along side or directly on the back of the gadget 2. Add a band to make it wearable 3. Voice put out instruction
‘It could be better to have the instruction printed on the gadget’ ‘Clicked twice to activate; Voice put in’ ‘Hold for 3 seconds to send 000 to authorities’ ‘It could be easier for kids and the elderly to wear around the wrist.’
Virtual user testing via Zoom. Meeting conducted and recorded on May 13th.
Yushi Yang
Inspiration
1. Simple tap and hold to send help 2. User friendly to kids, the elderly, the deaf and the blind.
1. Simple instruction needed 2. Not wearable at the moment
USER TESTING —TASK 3 STORYBOARD To seek for help during emergency via Prototype 3.0 Interface part/Location
Verbal Protocol
Strengths
Potential Future Improvement
Home page (New user instructions in emergency situations)
‘I think it is clear enough to draw attention from new users.
Introduce emergency mode and how to seek for help at the beginning of the application.
Keep the existing style or create floating window for notification
1. ‘I think its very straightforward, which is good for people to make a selection as quickly as possible when emergency happens.’ 2. ‘Household emergencies are the most common emergencies in the neighbourhood. It’s good to place it on top.’ 3. Clicked on household emergency and turned up multiple detailed selections afterwards
1. Immediate Colour change from light blue to red to make the options more recognisable. 2. Simple and straightforward emergency type selections 3. Offer ‘000’ call
Further research on emergency types and create a more hierarchical help system
1. 2. 3. 4.
1. Simple tap and hold to send help 2. User friendly to kids, the elderly, the deaf and the blind. 3. Wearable design 4. Monitor blood pressure, blood oxygen and heart beat 5. Alarm system included
Keep the existing style and improve the function of health monitoring
Emergency type selection page
Send help via ‘HIT‘
‘I can hear the instruction played by the gadgets.’ ‘Clicked twice to activate; Voice put in’ ‘Hold for 3 seconds to send 000 to authorities’ Put on the wrist to monitor blood pressure, heartbeat, blood oxygen,...
Yushi Yang
yyan2194
STORYBOARD
Scenario
Online digital app
Smart electronic device
Self-service hub
Mr. Wong lives alone in an apartment building. It was around 12 o’clock in the afternoon when he fell over himself. He then used his HINT button to seek for help from neighbours. Virtual mobile application
HINT wearable device
Physical supplement hub
Yushi Yang
yyan2194
PRECEDENTS 1 Precedents Building Resilient Neighbourhoods (BRN)
Physical feature：Shared emergency supply bench
• What’s included in the bench?
BRN
www.resilientneighbourhoods.ca
is a collaborative effort to help create more resilient communities and neighbourhoods in British Columbia. It is currently delivered and hosted by the non-profit Building Resilient Neighbourhoods Society.
First aid kits
Water purification equipment
‘Resilient Street’ are places where neighbours: Bulletin board
Know each other and over time develop strong ties
Share resources and other items (like tools, sports equipment, etc.)
Are available to help each other out in small or sometimes big ways
Are able to cooperate and share leadership in street or building issues and activities
‘Before the program, neighbours seldom reached out to talk. ...Now, we often get together for parties and help one another with projects and events. We support each other with house/pet sitting, sharing gardens/harvest, sharing tools, repairing equipment. It has transformed my street into the type of community that can deal with anything, good or bad.’ —Street member of Leonard Street in Victoria, British Columbia
Solar powered charger
Image source: https://www.neighbourlab.com/hub-001-leonard-st
• Strengths ‣ Encouraging concept the enhance the
• Weaknesses ‣ So far, there is no example showing an collaboration online&offline
‣
‣ ‣
‣
neighbourhood ties on a daily basis Neighbours share resources with each other to reduce time and extra financial burden Well organised by the neighbourhood committee
‣ ‣
digital interactive solutions Limitation of emergency supplies included in the physical features There is only one supply station in the big community at the moment Not accessible for people on wheelchairs No emergency precaution functions
Strengths of Neighbour Harbour Physical Hub：
‣ As an offline ‣ ‣
neighbourhood meeting and communication spot Neighbours can deposit and take things using the hub drawers Simple colour mode changes to indicate different situation
‣ Touchable screen ‣ Enable printable copies of ‣ ‣ ‣
emergency plans and daily sharing contents Multiple supplements in storage to cope with various kinds of emergencies Accessible design and ergonomic design for children and the elderly Multiple hubs are established in the community to cover certain range of resident Yushi Yang
yyan2194
PRECEDENTS 2 Precedents Nextdoor provides social networking services
Image source:https://apps.apple.com/au/app/get-prepared/id1292194053
for people that helps people communicate with their neighbours. It is the neighbourhood hub for trusted connections and the exchange of helpful information, goods, and services.
• Slogan:
When neighbourhood starts talking, things get easier.
• Key functions: The private social network for your neighbourhood.
• However, there are some critical issues about Nextdoor ‘The reality of this site is something entirely different. Not all neighbours are “nice people,” and in this, Nextdoor simply ignores the possibility that there are mentally maladjusted individuals that can stalk and even harm you. This is especially true in their “National and State Politics” section, where even if you “mute” a nasty neighbour, they can still IM you with threats, innuendoes, and sexual overtones.‘ ——S. Novi. ‘The Ugly Dirty Truth about Nextdoor’ No allowance for nicknames, real names are compulsory for joining the network Little to no immediate and practical help Unsuccessful content management
‣ Inevitable sexual harassment ‣ Contain racially charged jokes and cuss words Buy & sell household Hire nearby pros & items sitters
Get crime and safety alerts
• Strengths ‣ Application on a daily basis ‣ Private local social network ‣ Ask for advice and exchange ‣
information among neighbours All members are verified for the sake of safety
Find neighbourhood recommendations
Stay updated on news
Communicate Yourself to neighbours
• Weaknesses ‣ No specific emphasis on emergency ‣ Privacy issue ‣ Information not up-to-date ‣ Poor supervision on contents ‣ Crowded information with poor organisation
Nextdoor: When a neighourhood website turns unneighbourly ——Martha Ross, The Mercury News
Strengths of Harbour Neighbour Digital Application
‣ Users’ personal information ‣ ‣
is thoughtfully protected and coded User profile is displayed to the hero only during emergencies Simple and careful selection of contents to be displayed on the interface
‣ Scheduled online maintenance and content management ‣ Community based intra-network with no interference from outsiders
‣ Simple and efficient ways to report issues ‣ The network is linked to the police system and emergency department to ensure safety Yushi Yang
yyan2194
PRECEDENTS 3 Precedents Flic Smart Button
• Strengths ‣ Simple and easy to operate ‣ Able to link to any smart devices and
—Control anything with a push https://flic.io
• Three triggers, endless combinations
‣ ‣
• Weaknesses ‣ There is no voice input or voice broadcast function
household systems Easy to carry around and light weight Customisable with stickers to fit any condition
‣ ‣
available so far It’s easy to loose due to its tiny volume There is no signal light on the device to indicate different conditions or to make warnings in emergency situations
In terms of user needs: Push
Double push
Hold
• Accessible to the older adults and young kids • Least skill requirement
• No voice input or broadcast function for the blind • No emergency precaution or report system
Image source: https://flic.io
• Easy to adjust and change
Strengths of Hint：
Special emergency functions:
Simple functions: Double-tap to activate
Sticks to any surface
Replaceable battery Speak when light up
Customisable with stickers
Image source: https://flic.io
Hold ‘H’ button for 3 seconds
Rigid metal clip
Send transcribed information
Watch band
Red lights turns up
Send location to authorities
• Wearable design, easy to carry around • Equipped with heart rate, blood pressure and blood oxygen monitor • Voice input and broadcast functions available • Clear visual indication of conditions by • Voice alert and vibration activates when different colours of lights
urgent health condition occurs Yushi Yang
yyan2194
DISCUSSION PRECEDENTS Generally, the original user needs are well responded. In addition, through iterative design, extra and more concrete and detailed needs of users are further identified and responded.
Advantages and unique features Neighbourhood focused A community powered scheme to enable prompt help during emergency situations with a collective mind and strength of the loving neighbours who live close to each other.
The system is particularly designed for neighbourhood and is to be operated in the loop of a community. It provides a platform both online and offline. Community bonds is expected to be enhanced in the process of using the system.
Novel structural mode
Contents centering on emergency response lifecycle are designed to prepare, guide and encourage neighbourhood participation, which can be retrieved and practiced on a daily basis and on spot of emergency occasions.
A cross-channel community-based model is adopted to offer synchronized but less redundant communication in the hope to ensure the effectiveness and efficiency of the system.
The design adopts a cross-channel & multi-modal structural model to cater for users as extensive as possible, taking users’ physical mobile and cognitive ability and media use habits into consideration.
Practical and streamlined contents design Provides practical and useful information, plans and activity ideas for users. Simple and minimal steps to send help and locate information, which is crucial in emergency response.
Extended design concerns Uniting and synchronised three components of the system via adding visual and audio effects. Accessibility is thoughtfully designed especially with the physical hub
Due to the social distancing and travel restrictions during the period of coronavirus outbreak in 2020, face-to-face testings including interviews and real-time behavioural feedbacks and field visits to various neighbourhoods were not put into practice. In order to help realise the community-based emergency response design, the following steps are planned to be conducted in the further period of design:
• Testings with a broader range of users from various neighbourhoods • Create high-fidelity digital prototyping for further feedbacks
Image source: dreamstime.com
• Create physical models of the supplement hub and Hint button to test with
During the iterative process, the following testing methods appeared to be the most successful with insightful feedbacks
• Paper prototyping — Rapid and fun process to trigger immediate and insightful
• Think aloud method — enable testers to stay focused and help capture user preferences and
• Scenarios and storyboards — visualised ideas to put oneself in the scenario and
• Post-experience questionnaires — help capture a comprehensive impression of usability and show a
feedbacks for different iterations
arouse empathy with the persona
performance data simultaneously
positive overall preference of the scheme (85 out of 100, see Appendix F)
Yushi Yang
yyan2194
REFERENCE PRECEDENTS “A Guide to Interface Design for Older Adults | Toptal.” n.d. Accessed May 24, 2020. https://www.toptal.com/designers/ui/ui-design-for-older-adults. Annika, L. n.d. “How Much Can a KAP Survey Tell Us about People’s Knowledge, Attitudes and Practices? Some Observations from Medical Anthropology Research on Malaria in Pregnancy in Malawi.” Anthropol Matters J 11: 1–13. Bichard, E., and A. Kazmierczak. n.d. “Are Homeowners Willing to Adapt to and Mitigate the Effects of Climate Change?” Climate Change 112: 633–54. Bichard, Erik, and Aleksandra Kazmierczak. 2012. “Are Homeowners Willing to Adapt to and Mitigate the Effects of Climate Change?” Climatic Change 112 (3–4): 633–54. https://doi.org/10.1007/s10584-011-0257-8. Botzen, WJW., JCHJ. Aerts, and JCJM. van den Bergh. n.d. “Dependence of Flood Risk Perceptions on Socioeconomic and Objective Risk Factors.” Water Resour Res 45: 1–15. .“B-RESILIENT: Creating Apps Together for Community Wellness.” n.d. Accessed May 9, 2020. https://uclahealth.ideascale.com/a/dtd/B-RESILIENT-Creating-Apps-Together-for-Community-Wellness/813275-19075. Burke, Sloane, Jeffrey W Bethel, and Amber Foreman Britt. 2012. “Assessing Disaster Preparedness among Latino Migrant and Seasonal Farmworkers in Eastern North Carolina.” International Journal of Environmental Research and Public Health 9 (9): 3115–33. https://doi.org/10.3390/ijerph9093115. Burningham, Kate, Jane Fielding, and Diana Thrush. 2008. “‘It’ll Never Happen to Me’: Understanding Public Awareness of Local Flood Risk.” Disasters 32 (2): 216–38. https://doi.org/10.1111/j.1467-7717.2007.01036.x. Chia, Eliana, and Keltie Craig. 2014. “Building Neighbourhood Social Resilience Greenest City Scholars Program.” Duang, YT., and GR. Jiang. n.d. “Review of Theory of Rational Action.” Adv Psychol Sci 16: 315–20. FEMA. n.d. “Personal Preparedness in America: Findings from the 2009 Citizen Corps National Survey.” “Flic Smart Button.” n.d. Accessed May 24, 2020. https://flic.io/. Grothmann, T., and F. Reusswig. n.d. “People at Risk of Flooding: Why Some Residents Take Precautionary Action While Others Do Not.” Nat Hazard 38: 101–20. Grothmann, Torsten, and Fritz Reusswig. 2006. “People at Risk of Flooding: Why Some Residents Take Precautionary Action While Others Do Not.” Natural Hazards 38 (1–2): 101–20. https://doi.org/10.1007/s11069-005-8604-6. Hallgren, Richard E. 1991. A Safer Future: Reducing the Impacts of Natural Disasters. Fire Risk Management. https://doi.org/10.17226/1840. Han, X., YB. Ding, and HW. Zhang. n.d. “Prevention of Sudden Disaster Risk and Public Participation in Megacity.” Shanghai J Prev Med 5: 248–55. Haynes, K., J. Barclay, and N. Pidgeon. n.d. “Whose Reality Counts? Factors Effecting the Perception of Volcanic Risk.” J Volcanol Geotherm Res 172: 259–72. Haynes, Katharine, Jenni Barclay, and Nick Pidgeon. 2008. “Whose Reality Counts? Factors Affecting the Perception of Volcanic Risk.” Journal of Volcanology and Geothermal Research 172 (3–4): 259–72. https://doi.org/10.1016/j.jvolgeores.2007.12.012. Johannesdottir, G., and G. Gisladottir. n.d. “People Living under Threat of Volcanic Hazard in Southern Iceland: Vulnerability and Risk Perception.” Nat Hazards Earth Syst Sci 10: 407–20. Jóhannesdóttir, G., and G. Gísladóttir. 2010. “People Living under Threat of Volcanic Hazard in Southern Iceland: Vulnerability and Risk Perception.” Natural Hazards and Earth System Science 10 (2): 407–20. https://doi.org/10.5194/nhess-10-407-2010. Karinanci, N., H. Bahatt, and D. Gulay. n.d. “Impact of a Community Disaster Awareness Training Program in Turkey: Does It Influence Hazard-Related Cognitions and Preparedness Behaviors?” Soc Behav Pers 33: 243–58 “Knowing Neighbours Could Save Lives - CFA News and Media.” n.d. Accessed May 29, 2020. https://news.cfa.vic.gov.au/-/know-your-neighbour-it-could-save-your-life. Levac, Joëlle, Darene Toal-Sullivan, and Tracey L O’Sullivan. 2012. “Household Emergency Preparedness: A Literature Review.” Journal of Community Health 37 (3): 725–33. https://doi.org/10.1007/s10900-011-9488-x “Nextdoor: When a Neighborhood Website Turns Unneighborly – The Mercury News.” n.d. Accessed May 29, 2020. https://www.mercurynews.com/2015/09/01/nextdoor-when-a-neighborhood-website-turns-unneighborly/. Ning, Y., MX. Tao, and JF. Hu. n.d. “Factors Affecting the Knowledge of Disastrous Event Response among Residents in Shaanxi Province.” Chin Prev Med 6: 473–76. Qiu, XX., QL. Zheng, and LH. Xia. n.d. “Application Research of Pneumoconiosis Patients Health Education Intervention by Using KAP Model.” Chin Occup Med 41: 265–71. Security, U.S. Department of Homeland. n.d. “Increasing Citizen Preparedness Through Applied Research Proceedings of a Research Roundtable.” “Story: FEMA Releases 2018 National Household Survey Results on Individual and Community Preparedness.” n.d. Accessed May 29, 2020. https://community.fema.gov/story/FEMA-Releases-2018-National-Household-Survey-Results-on-Individual-and-Community-Preparedness?lang=en_US Smith, James. 2016. “Air Pollution Gender, Class and Ethnicity.” The Conversation 38 (3): 624. https://doi.org/10.1093/PUBMED. Terpstra, Teun, Michael K. Lindell, and Jan M. Gutteling. 2009. “Does Communicating (Flood) Risk Affect (Flood) Risk Perceptions? Results of a Quasi-Experimental Study.” Risk Analysis 29 (8): 1141–55. https://doi.org/10.1111/j.1539-6924.2009.01252.x. “The 4 Golden Rules of UI Design | Adobe XD Ideas.” n.d. Accessed May 24, 2020. https://xd.adobe.com/ideas/process/ui-design/4-golden-rules-ui-design/. Toshie, M., TH. Tran, and ML. Doan. n.d. “Knowledge, Attitudes, Practices and Emotional Reactions among Residents of Avian Influenza (H5N1) Hit Communities in Vietnam.” PLoS ONE 10: 1–10. “UX Designers Must Think Physical- Prototypr.” n.d. Accessed Accessed 24, 2020. https://blog.prototypr.io/ux-designers-must-think-physical-78e73b2b5d2d. Vaughan, Elaine, and Timothy Tinker. 2009. “Effective Health Risk Communication about Pandemic Influenza for Vulnerable Populations.” American Journal of Public Health. https://doi.org/10.2105/AJPH.2009.162537. Vitense, Holly S., Julie A. Jacko, and V. Kathlene Emery. 2002. “Multimodal Feedback.” In , 49. Association for Computing Machinery (ACM). https://doi.org/10.1145/638249.638260. Vos, Marita, and Helen T. Sullivan. 2014. “Guest Editors’ Introduction Community Resilience in Crises: Technology and Social Media Enablers.” Human Technology 10 (2): 61–67. https://doi.org/10.17011/ht/urn.201411203310. Wachinger, Gisela, Ortwin Renn, Chloe Begg, and Christian Kuhlicke. 2013. “The Risk Perception Paradox-Implications for Governance and Communication of Natural Hazards.” Risk Analysis 33 (6): 1049–65. https://doi.org/10.1111/j.1539-6924.2012.01942.x. WHO. n.d. “Emergency and Humanitarian Action. Vulnerable on the Rise.” Xing, JJ. n.d. “Study on the Architecture and Key Elements of Emergency Preparedness Culture.” J Saf Sci Technol 10: 82–86. You, J., YH. Hao, and LJ. Gao. n.d. “Study on the Level of Emergency Items Preparedness and Its Influencing Factors among the Seven College Students in Heilongjiang Province.” Chin J Prev Med 16: 11–14. Yun-hong, L. n.d. “Application of Practice Model of Knowledge-Attitude-Belief in the Health Education for the Patients with Essential Hypertension.” J Qilu Nurs 3: 5. Zhang, WJ., YH. Hao, and QH. Wu. n.d. “Establishment and Evaluation of the Public’s Emergency Preparedness Measurement Scale.” Chin J Public Health 5: 650–52.
Yushi Yang
yyan2194
Appendix
A. Concept sketches
B. Images of prototypes
C. Images of storyboards
D. Photographs of user evaluation process
E. Testing procedure diagrams
F. User evaluation questionnaire
Appendix A—Concept sketches A neighbourhood mutual-aid emergency response system
Initial Concepts Community-based intra-network
Virtual+Physical Scheme
Participation
As broad user groups as possible
User data collection
Gathering space
Appendix B—Image of prototypes Stage ‘0’ draft paper prototyping
Image of prototypes Iteration phase II task 1
Image of prototypes Iteration phase II task 2
Image of prototypes Iteration phase II task 3
Image of prototypes Iteration phase III task 1
Image of prototypes Iteration phase III task 2
Image of prototypes Iteration phase III task 3
Image of physical hub design
Appendix C—Storyboards Iteration phase II
Storyboards Iteration phase III
Draft
Appendix D—Photographs of User Evaluation Process Iteration I Sketchy prototyping and initial concepts discussion via Zoom.
Iteration II Second iteration of paper prototype user evaluation by screen sharing via Zoom
.
Iteration III Third iteration of paper prototype user evaluation.
Appendix E—Testing procedures Start
Task 1
Start
Task 2
Home page
Task 3
Emergency page
Create events or share life hacks?
Finish
No
Start
Hold for 3 seconds
Become a helper?
Call ‘000’
Yes
Introduction
Type in event information
Finish
Check hub status
Finish
No
Offer help?
Yes
Finish
No
Check post status?
Send help message to help seeker
Collect passcode
Collect supplement
Follow navigation
Yes
Open user profile page
Finish
See your posts
Finish
Offer help
Select emergency type
Seek help
Check supplement
Post
Back to home page
Finish
View information
Select media
What kind of emergency situation?
Your emergency situations
Tap code
Select category
Witness an emergency
Appendix F—User evaluation questionnaires