Barangay (BRGY)

Overview

As a team of 8, our team aimed to create a project that acted as a creative solution towards pressing environmental, social, or economic issues. Designed for submission to The Royal Society of Arts (RSA) Student Design Awards 2022-2023 Competition.

UX & UI Design | Late 2022

Programs used:
IllustratorPhotoshop

Skills Used:

User Research
User Experience Design
User Interface Design

Wireframing
Visual & Graphic Design
Creative thinking

Meet the Team: Nether Systems

Research & Communication ✎
Ben Valles (PM)
Justice Gin (Research & UX/UI)
Jaymi Denise (Business Analyst)
Griffin Anderson (UX Researcher)

Visual and Product Design: ꕥ
Daniel Hanick (PM)
Breanna Tam (Visual & UX/UI)
Sandy Lin (Visual & UX/UI)
Kayla Hop Hing (UXR, and UX/UI)

My Roles and Responsibilities

At a glance, my roles and reponsibilities during this projects focused on:
I worked as both a UX/UI designer and Visual Designer on the Nether Systems team. I worked collaborative to create the overall brand identity, colour palette, and visual/graphical elements for our marketing materials (proposal boards, big idea summary and cover image). As well as wire-framing, building, and prototyping our final product alongside our product design team, working with my team members to create and prototype our web and mobile application.

Design Brief Exploration

As a team, we considered multiple ideas and collaborated effectively to formulate a handful of viable ideas for the different RSA briefs we had been considering. This brainstorm session yielded the following ideas:

Ideas we considered:

Load Shedding in South Africa

Product to address the load shedding (energy & water) crisis in South Africa, could be a resource for residents to connect with companies to ensure equal allocation of resources to each household.

Reimagining Public Transit

 Creating productive public spaces for people using the public transit system. This would create an environment that positively impacts businesses, mental health, and provides new work opportunities.‍

The Filipino Obesity Crisis

A product to help combat the Filipino obesity crisis and re-educate residents on different healthier food alternatives and ways to source them in the Philippines.

My Proposal to the Team ✧

During our ideation phase, I presented to the team an idea for an application that would serve as the community hub, work, and resource centre for new immigrants living in Canada.

I highlighted the experience that my own parents went through, and their experience acclimating to the culture, and finding work in Canada.
As Chinese immigrants coming to Canada, my parents came face-to-face with the bleak reality, that they were alone in a new country with very little money, no job, intermediate English skills, and no immediate friends or family.

Through navigating through all of these obstacles, they found websites that fostered community, provided information, jobs, and other helpful resources, that all catered to the Chinese-Canadian demographic, such as 51.com and Rolia.net. These sites helped them acclimate to life in Canada with much more ease, it provided them insider tips & tricks from others that went through similar situations, and the site also boasted active job posting and hiring sections. Decades later, my parents still use these very same sites, but for a different purpose, to find and hire personnel for jobs and contract work.

These websites and their resources were extremely helpful and supportive in their journey in navigating a new and unfamiliar landscape. As this was an issue close to my heart, I chose to earnestly push for us to create an application that could serve as a means to bridge the gap for new immigrants coming to Canada through digital literacy, sense of community, and accessible resources.

Problem Space

RSA Brief 7: Nature of Work

"How might we reimagine the way we work in the future to reflect local context, experiences and knowledge?"

Our Challenge:

How can we create a product that can bridge the social, and economical gap for Filipino-Canadian immigrants and newcomers to Canada, through accessible design, tools for professional development, and digital literacy?


Our Solution

BRGY (Barangay)

(“barangay” - /ˌbärəNGˈɡī/ (in the Philippines) meaning village, communities, and neighbourhoods)

BRGY: An inclusive, community-oriented web application that enables Filipino immigrants of Canada to foster digital literacy and career-building skills in exploring the Canadian job market.

Contextual Design Thinking

Because we wanted our product to tap into the users sense of “home” whilst still featuring an interface that was a seamless middle ground between Eastern and Western product design, it was essential for our team to understand the cultural, technological, and social contexts for the East Asian audience we are designing for.

Super Apps

Asian centric applications usually feature a multitude of features. These are dubbed as "super apps" that can boast a wide range of capabilities.
WeChat or Line for example, have features that range from communication channels, QR scanners, to financial transaction processing, and more.

Information Architecture

✦  East Asian applications more content heavy, than their Western counterparts. Typically, they utilize less white space to highlight their wide range of multipurpose actions.
Western design typically features more white space. The overall information architecture is much more condensed and spread apart.

Click-Through-Rates

East Asian design generally places more emphasis on click through rates (CTRs) thus resulting in the prioritization of pop-up advertisements and product marketing.
Western design do place value on CTRs, however, advertisements are shown in a more negative light.

The Filipino community is rapidly growing in Canada, according to a 2021 census, there are 957,355 Filipino Canadians living in Canada, or 2.58% of the total population. They are an extremely prevalent immigrant community within the nation, however, many individuals within this community face hardships in finding long-term, secure, employment. This could be due to a multitude of factors, such as unfamiliar job landscapes & cultures, lack of social connections, or culture shock. Not to mention, these challenges could become further compounded because of a language barrier, which ultimately back many immigrants into a corner as they are forced to take on more difficult and strenuous working conditions.

Through our research, we were able to determine that in the Filipino-Canadian community, there is a significant emphasis placed on word-of-mouth. However, the community lacked an effective product or service that promoted professional opportunities beyond just word-of-mouth.
Which is how our team determined that by designing a digital service that could promote the connection of Filipino immigrants with the community in the Greater Toronto Area (GTA) would provide some relief to their problems, and also foster community and new opportunities career-wise.

Competitive Landscape + Viability

51.ca

Offers local news, events, job boards, but was designed solely for the Chinese-Canadian community. The website is designed with little regard for standard UX/UI practices, information hierarchy, and there are large chunks of the website that cannot be translated. The jobs board is active and refreshes daily, however, the postings themselves are not translatable & many only feature minimal information about the job position/company.

Rolia.net

Initially founded in the year 2000 and is a big hit within the Chinese-Canadian community. With a mission statement to be open and welcome to everyone, It's a place for people who share Chinese root and heritage, as well as people who are interested in Chinese cultures, both traditional and modern. The site offers helpful resources such as discussion forums for practically any topic (both in English & Chinese), extensive travel guides, messaging, and music sharing,

Our Proposal Boards


Research Driven Design

Primary Research

Our team leveraged primary research methods to help us gain a deeper understanding of the Filipino-Canadian communities living in Canada. Our primary research helped us make informed design choices pertaining to the existing pain points and needs of our demographic in order to maximise accessibility and usability within our product. Our research includes two major outputs: 

Community Survey

Our survey’s objective was to generate quantitative data and gain insights into the various users that exist within our target demographic, what their needs and goals are, and through what methods they currently receive their resources related to community, digital literacy, and navigating the Canadian job market.

(the community survey was created using both English and Tagalog)

Interviews

We knew we needed to gain specific input related to exploring the perspectives, opinions, behaviours, and experiences of our target group. So our team conducted five interviews with first-generation Filipino immigrants in Canada.

Research Insights ⚡️

Weight of Words 💬

Within Filipino communities in Canada & around the world, it's common to see job opportunities spread through word-of-mouth. Often times, employers will find potential employees through mutual connections and similar cultural backgrounds and nationalities.

A Different Landscape 🏙

 There are significant differences pertaining to the job landscape in the Philippines than from that of North America. Although there are similarities, it mainly comes down to smaller differences within the hiring process (application process, interview structure, and resume. 

Job Security 🔐

Many individuals immigrate from the Philippines to Canada with the intention to find work. With the goal to send a portion of their pay cheque overseas to support their families. Because of this, Filipino immigrants usually place a high degree of value on working hard to get job security, and opportunities for long-term employment.


Visual Design

Overview

When brainstorming the visual components of our system, there were two essential attributes that heavily informed our design decisions.
Since BRGY (Barangay) is meant to represent community, fostering relationships, and forming connections, much of the design choices we have made revolved around invoking a feeling of familiarity. Our colour palettes, graphics, and imagery all have major influences from Filipino culture, trends, and the country's natural environment. We incorporated this with North American design trends that place often gravitate towards a more minimalistic style with ample white space.

Design Trend Influences ☁︎

East Asian

✦ Maximalist approach to design
✦ Information dense and text-heavy
✦ Bold, saturated colours
✦ Graphics tend to be pictoral and decorative - emphasis on character design and iconography

Phillipines

Reds and Oranges are used often
✦ Gold accents - for a touch of sophistication
✦ Geared towards nature and the inclusion of natural elements
✦ Line art and Geometric shapes

North America

✦ North American design, generally speaking, places more emphasis on a minimalistic system, and designs are created with extensive thought towards negative space, and readability.

Ideation

Finalized Colour Pallete

Prototyping ✎

Scenario Mapping

Our team went through the process of scenario mapping, with the goal of mapping out the steps that would be taken when navigating our system through the user’s eyes. This was a stepping stone for us before we moved onto building the medium-fidelity prototype design.

Design Decisions

System Features:

Because of the overarching goal of our app, we incorporated the following sections:

To Foster Professional Connections

✦ Homepage
✦ Dashboard for Individuals
✦ Dashboard for Businesses
✦ Resume Builder
✦ Financial Transactions

To Foster Outreach &
Sense of Community

✦ Events Hub
✦ News page
✦ Messaging system
✦ User profiles

Homepage

The homepage serves as the one-stop hub to accessing all of the features we offer on the BRGY (Barangay) system. this page serves as the direct bridge between the professional and personal content in the system.

Two Dashboards

The two dashboards are intended to help our users differentiate between a business account and individual user account. A business account can perform different actions than an individual user account can. By separating the professional work related content from the homepage, and the news, community, and events content is meant to avoid cognitive overload.


Our Working Prototype

Our final working prototype is offered in both a mobile and web application view for BRGY (Barangay).