Embedded Files
Bridging cultural divides and fostering integration through shared hobbies and common interests
UI/UX - Mobile web development - React.js - MongoDB
Overview
HobiGo! is a mobile web application designed to address the needs and challenges faced by refugees, with a focus on enabling social integration, promoting cultural exchange, and rekindling hobbies and interests.
Goals
Identify the problems and requirements of refugees through extensive research
Devise a solution involving mobile web applications
Prototype this solution to a point which would enable testing and refinement
Result
As of now, HobiGo! primarily exists as a Figma prototype with a basic implementation in React.js. While the some core features outlined in the prototype work, the functionality remains limited.
Users can interact with rudimentary features such as registration, login, viewing pages and event creation. The backend infrastructure, powered by MongoDB, is in place but requires further integration and refinement.
You can try HobiGo! on Figma or take a look at the code on GitHub.
Research
We began with extensive research on refugee experiences, including surveys in English, German, and Russian, as well as interviews with individuals engaged in support initiatives.
Our key findings highlighted that:
many refugees feel isolated and alone
many refugees struggle with the language and language courses (when present) were not enough
integration and learning is complicated by prejudice and bias in the community
Based on these findings, we saw an opportunity to make a platform that would connect refugees with locals in the target country and enable them to organically participate in the culture, as well as learn the language.
Through our research of existing solutions, particularly among platforms aimed at connecting people, we identified some shortcomings:
most connections initiated online stayed online and failed to translate into meaningful or long term relationships.
platforms with a wider focus, like social media platforms, are prone to bias, meaning that refugees could still be excluded
platforms with a narrow focus, like ones aimed at volunteers, have significantly smaller user bases and fail to attract people from other groups
In order to avoid these, we needed to include something that would launch online relationships into real life, would bridge cultural divides and would be able to attract diverse user groups - hobbies and common interests.
This is why we conceptualized HobiGo! as a platform that helps build genuine connections through shared hobbies, interests, and real-life activities. It benefits users from diverse backgrounds, offering opportunities for cultural immersion, language learning, and exchange of experiences.
You can view the pdf of the full research documentation (currently only available in German) on GitHub.
Prototyping
Following the research phase, and after considering the main features we were interested in, we created the first low-fidelity prototype.
The main features the platform required were:
ability to create "events" (during which the users would come together to participate in a hobby or interest), including place and time
ability to join those events
feature that saves/lists created events
a search feature
login/signup feature
As our vision for HobiGo! (named Habby at that point in time) began to take shape, we transitioned to the development of a more refined prototype using Figma, allowing our testers to use it as a click-dummy at the same time and deliver feedback so we could adjust things as necessary.
Some changes and additions:
A feature that suggests events to users based on their interests and location. This meant that we'd need our users to select their interests (preferably upon registration) that would then be stored in their profile.
Home page with suggestions and currently scheduled events.
Fleshed out event creation/join screen, now with description, amount of participants and pictures.
Schedule screen with a calendar for a better overview.
Chat, allowing users to exchange messages and reconnect after their activities were over.
After many iterations, we arrived at the current version of the prototype.
Some functional changes:
improved the search by adding interest tags
profile now allows to edit interests and set location
maps were incorporated to clearly visualize event locations
It was important for us to be considerate of user data privacy, as well as to minimize potential discrimination based on gender, age, nationality and more.
For this reason many user inputs are optional, allowing users to control the level of information they share.
But the biggest changes happened on the design side.
For our color theme, we settled on a soft green color. As HobiGo! is aimed at improving lives we wanted to invoke feelings of stability, peace, but also of a positive future outlook.
These considerations are also reflected in the HobiGo! logotype and landing page illustration.
Style Guide
Development
We partially translated our Figma prototype into a React.js mobile web application, supported by a MongoDB backend.
Due to the timeline given for different phases of this project - around 80% of the time was allocated for research and prototyping phases - the scope of our application turned out to greatly exceed our capabilities to fully implement it in the remaining time. This is why we focussed on connecting frontend and backend, as well as a few screens and features for initial development.
The code is available on GitHub.
Future
Moving forward, there is a lot of space to build upon the existing foundation, implement remaining features, and enhance the user experience. Beyond that, we would like to improve accessibility by introducing features such as dark mode, high contrast mode, text-to-speech capabilities, and of course a language selector, in order to ensure that HobiGo! is inclusive and accessible to users with diverse needs and preferences.
Google Sites
Report abuse