SEBASTIAAN designing

Taking a closer look at the Culture Raver.
What are the needs?

To connect them to the collection.

User: Needs something that creates independence, information, maximum content in a minimal amount of time, social, fresh.

Collection presents:
Culture, activities, nature routes, bike rides, camping, mindfulness.

The Culture Raver being a predominantly young user group.

Here a short description:

The Culture Raver is a subcategory within the Explorer archetype. Usually a young adult, but not limited to that age group. A Culture Raver enjoys immersing themselves into different cultures and learning about them. This is usually done by very shallow research back home and then exploring the topics with locals through both activities and talking. The cultural raver doesn’t just learn about new cultures of their current residence, but also different one’s by talking to other expats who are willing to open up and also learn about their culture.

The font that will be needed for for a compendium/guide app could be very fun to make something playful for a young group. Indiana Jones, adventures, etc. This will make traveling a more fun adventure instead of a dry wiki page about routes

The feedback raises goods points that I felt as well. It's nice to get confirmation about things I feel. The sketches were loose ideas that might lose focus on the original goal of connecting the user with the collection.

I'm now planning on combining the 'Hostile design', and 'Something About Us' idea into a route app where you can collect parts of the collection and acquire more information. I need to work out some kinks like wether I want to add an audio option or add a compendium. Decisions decisions..

My first attempt at creating the app interface was a very 'me' version of I wanted it to look like. When messing with the fonts I realized some things mentioned during the lesson. The subtle hierarchy of messed up typography and text placement actually taught me more than looking a 'good' example. You get a hands-on interaction with the effects of typography.

When I was done messing with the text, Marvin sent me his fonts and layout which looked very professional and clean. His fonts really opened my eyes and encouraged me to look into more "fitting" fonts.

As a final product I maintained Futura as the "system" font and the font Marvin showed me as the font for reading. Seperating the two functions is a form of hierarchy I never toyed with.

Sketches after reflecting

The collection and the user are too divided in some of the ideas. Some ideas could be merged. Take a step back and look at the collection. What does it bring you and how it is applicable to the user group?

Designing the companion app felt like there was a lot to do with no clear idea. There was no KISS principle, just a lot of loose ideas that went.. nowhere. This is very clear in the testplan I had to make for Arjen en Maytals lesson.

He spoke to me about taking a step back and really thinking about having a clear goal for the app. I think my mistake was listening almost too much to the teachers and letting myself be directed by them instead of thinking critically myself.

Perhaps this was because of my first project where I totally did not listen to the teachers at all and barely communicated resulting in an NQ. However, balance is needed and I need to teach myself how to thread the fine line.

I visited some routes from Staatsbosbeheer. Haagse Bos and Lage Bergsche Bos. I usually come to nature to reflect and think. This was a bit harder because I was walking IN my assignment. When walking I noticed a few things: couples, small groups walking together or chilling. Hanging in hammocks, meditating, walking the dog, climbing trees, exercising or kids playing.

What I noticed was that the forest is a medium for activities for people. A place of recreation, connecting with each other and yourself. The forests are like a playground where you can bring your own stuff or creativity to make something out of all that room. It's a social hub.

As people we create something out of nothing. The skaters near Den Haag centraal showed me that the most. It's not a place made for skaters, but once they found a spot, (of belonging), they
took it over and claimed it as their own. New people meet each other and help each other out, learning new tricks. Something that transcends the only-in-Dutch-signs of staatsbosbeheer.

I came up with the idea of a forest hub that creates a place for expats to join each other and socialise. A place that brings people together because of the various activities that are doable there. Usually sports bring people together and is an easy ice-breaker.

This however is not specific enough for expats themselves. This is a fun initiative for people of all ages and groups to join each other.

I think a core part of the Culture Raver is a form of socialization and adventure, maybe a studious mindset. This doesn't do that.

The culture raver requires an activity, something that is active and an immediate ice-breaker.

You've reached the end of this part. Please scroll to the left and down until you see a new header :)

SCROLL TO THE RIGHT FOR MORE INFO >>>>>>

This is the idea I want to go with. After having thought of something for a while I really think this is the best option to go with as it connects with staatsbosbeheer, because the challenges are all there. It allows you to meet new people, because the opposing team is a random group of people or your friends. Through activities you learn about culture, nature and about each other.

This also helps expats fight the loneliness, something which they often experience.

You've reached the end of this part. Please scroll to the left and down until you see a new header :)

Now that I know what I want to do, I can start designing. I really like these fonts, but they can chill change. I will revisit this later. Now it's coming down to take a good look at what colours are attractive to young people while maintaining a forest/nature/outdoors vibe.

I took inspiration from sunsets, partygames, flowers and tones in nature.

Now that I've chosen a more general and consistent design, it's time to start designing the app. This is what I've ended up with:

This seems rather playful and still has the 'forest' colours.

The brown is supposed to be the system/header font. Green should be press-able buttons and yellow should communicate a sense of action that requires more direct editing

The triangles in the left corner in the "menu" bar should be meant as a 'back' button.

ADOBE XD LINK: https://xd.adobe.com/view/4c5b7e9a-3e4a-46f4-8a28-c10c2befd87b-1908/

After my first test I reviewed and expanded my app. I tried clearing the app up, by changing the header font to Proxima nova and keeping the buttons Futura to communicate a different function of the two fonts.

I changed the colors to look a little more clear and clean, while trying to maintain the 'forest' colors. The harsh yellow wasn't natural feeling.

We're ready has been changed to "ready to join" and the color has been changed to brown instead of orange. Orange is now reserved for small interactions
I also added more screens to test the app as how I would want it to be and properly function. Features are still missing though, like the gallery and chat function.

ADOBE XD LINK: https://xd.adobe.com/view/cbd4715e-9a5f-4c13-9d70-d618cc63fc2b-9e87/

After my first test, I had a lot of insights.

My test subject gave advice about the design of the app (colors, mostly). There is a lot of work to do.

I should add more to the app to make it feel more complete: submissions, functions of the app (the game itself, adding friends, making a lobby)

The participant also mentioned multiple things being very unclear. Some buttons (We're Ready!) felt like buttons but were in fact not buttons. Same was for the pencil icon, which did not work yet. She also thought the "headers" were things she could edit. I should change a lot to make sure it's more clear they're part of the system and not editable.

The colours were too harsh. She's correct. So I will change that too.

So this went much better. I tested the interface on multiple people and they understood it much more. That said, they were app designers and studying computer science so their knowledge might have been much more intuitive.

"the app does what it should do" was the main point of feedback. They mentioned the "how to" menu was iffy.

They also said the X button in the lobby section was very unclear. They kind of felt stuck there, so it should be more clear for them that is an actual action instead of a pictogram.

I should now focus on the leaderboard, gallery and chat function as that is a function I have not properly tested and worked out yet. Curious as to what that could lead to.

Speaking with Megan, I received some really useful feedback:

We both agreed that I need to emphasize the expat propositions more in the app. This could be done by making a more social aspect of the app where you, instead of with an established group of friends, as a single player can match and find other people to play with!

I also want to update the gallery function more and add a 'reaction screen' to the submissions of the other contestants.

Megans other part of feedback was the submissions and verification of the game. It might be better to add a few modifiers: creativity, cleverness, objective score, etc. to make the game more entertaining towards the opposing team instead of just winning.

SCROLL TO THE RIGHT FOR MORE INFO >>>>>>

For version TREE I tweaked a bunch of things for usability's sake + almost everything from my previous tests. Such as:

- Chat function
- Creativity scores
- Login in system
- Single player mode
- Find new people mode
- App store mockup
- Different colors per team
- Improved gallery and leaderboard

Use it yourself:

https://xd.adobe.com/view/38ae0fa3-65f7-471b-a84c-1a6994427fe4-6dfd/

SCROLL TO THE RIGHT FOR MORE INFO >>>>>>

Single player mode with map to find people near you

New challenge + verification system with new options

SCROLL TO THE RIGHT FOR MORE INFO >>>>>>

New leaderboard with 'creativity points' + gallery with new functions

App store mock up to clarify the "ice breaker" USP of the Forust app

Creativity score try-outs

I got feedback on my latest version. The biggest point was that the app looks very static and unplayful. The 'fun' and 'game' element is missing from this otherwise fun and playful game.

Megans feedback was to make the screens more interactive. Less static.

In user testing I received similar feedback: The app is static, text is too big colors are too similar.

In this version I changed the colors to a more bright color palette, for a more joyful and friendly look

I also changed the shape of the buttons to a rounded square, so that it looks less static and harsh.

I also changed the 'header' font to Zalamander and the body text to Proxima nova. Both fonts are more playful and less harsh.

I did not add pictures, but I added illustrative elements to emphasize playfulness and make the screen less static.

I made the 'team 2' color more present in all menus to add more playfulness and retract bias from the menu. I also changed the logo to be more.

ADOBE XD LINK: https://xd.adobe.com/view/bbbb6535-b83e-4dac-bb7a-873e073ac0da-eee8/

This was the first iterations of the redesign. I tried to find playfulness in patterns, but to no avail. Making something more playful requires a bit more 'randomness'

The second iteration was the original colors but with a different hierarchy and rounding the buttons a bit less to still make it 'system-like' while maintaning playfulness

The 'waves' are a bit more dynamic but don't seem to fit a forest theme and feel a little too 'pepsi'. Eventually I settled on stepping outside of my comfort zone and illustrate the surrounding of the app

This is the eventual design I went with.

New signing up / log in screen

New Menu screen. I placed the buttons a little funky for a playful effect.

The lobby is still a manageable and clear space, however, it's still in line with the new style

The starting screen is now like a the start of a racing track. I tried to keep in a sense of urgency and competition using these colours

The challenge screen is a less bloated and using both the team colors now. Incoming picture is orange, clarifying that Team 2 has sent something.

Scoring has been updated to look a lot more fun. It also doesn't count the score of 'creativity' scores anymore. It tells the players who has the most of each category. Easing up the competition part and more geared towards small jokes. These categories and juxtapose each other

Gallery is the final interaction you have with each other. You can view the gallery, react to it (sharing on FB, Instagram or chatting), you can also go straight to a chat or rematch with each other for another round