https://embed.figma.com/design/aEcqEXgnkCTRFnkJbHaiuf/International-students?node-id=2-24263&t=wH4MIRxcFfoddWHf-1&embed-host=notion&footer=false&theme=system
When developing the app I sourced the majority of photographs from Unsplash. I also used people’s Google review photos of food and the Belfast International group I used their photos to represent events that then they posted about on social media. I think this mix of different sources makes it look a lot more realistic rather than just Unsplash as the majority of them are very professional.
When designing the app interface the icons I used were from Iconify, and I picked ones that fit the brand. I did alter some making them more rounded and less sharp to build a set that looked the same.
I made the icon that takes the user to the Amigo pairing page as there is no way of getting to that page without restarting the prototype.
When I initially started designing screens for Amigo I had done these two onboarding screens that allowed the user to create an account and have the content and pair system based on the interest that they select. But this doesn't show a user's real journey of boarding and doesn't include any language elements, which was some of my feedback from the week 12 critique.
So I added language onboarding as well as keeping it the same layout as the interest page. I created 3 sections of languages that you speak, are learning, and are interested in (I added the interested section as it gives the opportunity to meet others who are also interested in learning it). As there is a different scale of language from having the 3 sections I added another screen that allows you to pick your level of ability.
After my user testing I got feedback about some of the order of screens and I made those changes.User testing
https://embed.figma.com/design/aEcqEXgnkCTRFnkJbHaiuf/International-students?node-id=2-24961&t=1kxLVpVtAwCqNeoG-1&embed-host=notion&footer=false&theme=system
I didn’t use a lot of components and variables for this project apart from the tags that related to their interests and languages which have hover states and click options. because of the number of different tags, I utilized the lesson we got on auto layouts and Figma assets to make it as quick as possible to create all the different tags. the other components that I made were for the navigation bar and the banner to make them consistent across all screens. I also created a shared component that was on a frame and then individual people were components with the stroke and weight with colour showing the response to being clicked on, I was then able to add those to the frame so that they individually would be able to give a response.
When I was showing how the marching system would work on the social media side, I originally had it on a delay when on the main explorer page it would open up your match after a certain. Of time but I was advised to create a clearer way of showing this I was also told to have more than just the chat page and to create an automatic conversation to represent the idea better. so I decided to change the onboarding so at the end there is an option to join the pairing system or not. if you agree you will automatically open your match which you can open the chat and then the interaction works on delays having a conversation that then you can scroll through at the end. this was a really helpful idea as it represents my idea a lot clearer and I can explain it a lot better.