Hi hi everyone!
I know that many of you might think that rhythm appears only in musical compositions. But what if I tell you that rhythm is everywhere!
![](https://static.wixstatic.com/media/335d26_fdd0a906e9fb4aa6acbfef9ec89d2c4b~mv2.gif/v1/fill/w_500,h_281,al_c,pstr/335d26_fdd0a906e9fb4aa6acbfef9ec89d2c4b~mv2.gif)
Our daily routine, high traffic on the roads of our cities, enormous amount of people on the mornings.
Everything goes with its own rhythm, and our life is not an exception as well ヾ(⌐■_■)ノ♪
Why am I telling you all this stuff? Welp, the answer is quite simple. I just can't help but share this finding with you. Yes, today I'm gonna tell you about one of the most popular rhythm games - osu!
Okay Damir, I got there, so what's next? - Ohh, I forgot about that part, Okay, today I'll talk about this game's website and how to navigate there (~˘▾˘)~
First of all we will start from the main page and will try to figure out three fundamental concepts of this site, such as: audience, purpose and context.
![](https://static.wixstatic.com/media/335d26_f10f0d1227b54af2bbe696662d561473~mv2.png/v1/fill/w_980,h_485,al_c,q_90,usm_0.66_1.00_0.01,enc_auto/335d26_f10f0d1227b54af2bbe696662d561473~mv2.png)
Picture 1.
From the first sight we can see that osu! has simple navigation bar and big gallery with the game's mascot on the left side and purple download button (visual mode). The primary audience are gamers who are familiar with this kind of interface. However, according to Writer/Designer (W/D) there is also a secondary audience, but it's not so obvious. It may be people who are interested in music and they want to test their sense of rhythm. Now we can state that the main purpose is to make people download this game. To attract people there is also a gif which shows a sneak of a gameplay (aural mode). Also, 2 quotes (linguistic mode) which are a direct appeal, ensures us to click on the "Download" button.
"the bestest free-to-win rhythm game"
"rhythm is just a click away"
Going to the context we have to be sure what it is. Again, according to W/D context considers the questions of where and when the text is published, how it should be read and what surrounds it. Well, the website with the game as well was published in 2007 year. The site was intended as for a PC users, and mobile users as well. The choices of a medium are very good, everything is placed where it should be.
Now, let's talk about Design Choices
In W/D it's clearly showed that there are six main points such as:
Emphasis
Contrast
Color
Organization
Alignment
Proximity
First of all, site uses good color palette which consists of purple, pink, blue and its shades.
![](https://static.wixstatic.com/media/335d26_44f5d1e963be405fa14ac308cfe342ff~mv2.png/v1/fill/w_980,h_249,al_c,q_85,usm_0.66_1.00_0.01,enc_auto/335d26_44f5d1e963be405fa14ac308cfe342ff~mv2.png)
While on the main page (after log in) , there are mostly blue, purple and a bit of pink colors.
Picture 2.
Also, the website uses quite simple organization such as flat design (spatial mode) which implies that there is only necessary information on the screen. As we mentioned flat design, it also means that the buttons are grouped in close proximity where we can find different sub-groups to easily navigate to desired destination. This is a common construction on many sites nowadays. Simple for users and creators as well.
Picture 3.
![](https://static.wixstatic.com/media/335d26_687c8cd117e14ce8a3c59a5a46137fc7~mv2.png/v1/fill/w_980,h_308,al_c,q_85,usm_0.66_1.00_0.01,enc_auto/335d26_687c8cd117e14ce8a3c59a5a46137fc7~mv2.png)
Going back to the color I just can't ignore the fact that on profile page we can clearly see the whole use of color palette (even some shades of red). These colors often (especially blue) are used in game industry, they give some sense of freedom. Because if we imagine blue sky and stars which are far away from us we'll get some calm vibes from it (。◕‿◕。). As we are speaking about the color scheme I need to say that the mascot of the game (Picture 1.) is designed in the same colors.
This is how the main page look after a user logs in
![](https://static.wixstatic.com/media/335d26_4838c0ca62d94936a5bf4d072bbe1119~mv2.png/v1/fill/w_980,h_551,al_c,q_90,usm_0.66_1.00_0.01,enc_auto/335d26_4838c0ca62d94936a5bf4d072bbe1119~mv2.png)
Picture 4.
I want to note how creators combined emphasis. contrast and alignment principles together.
Picture 5.
![](https://static.wixstatic.com/media/335d26_d7b979b5106c4f2e8ad7650e267de40b~mv2.png/v1/fill/w_343,h_305,al_c,q_85,enc_auto/335d26_d7b979b5106c4f2e8ad7650e267de40b~mv2.png)
Creators made an emphasis obviously on these three buttons and infographics about current players. Everything the user should know is in this well-colored and placed segment. The choice of colors fits the color palette, Moreover, the organization is still on the same level! In contrast with dashboard and user's page (Picture 2.), every important information is visible for the user's sight.
As it was mentioned before alignment was executed in a way that the user could easily orient on the website. Main page (Picture 1.), where the main gallery is aligned center on both screen sides that the user won't get confused. The dashboard (Picture 4.) is aligned for the left side while the other info is aligned on the right side of the screen. In sum, we get user-friendly interface.
༼ つ ◕_◕ ༽つ
Wrap Up
Considering well-designed interface which exceeds all six main points of Design Choices AND completing all three fundamental concepts Moreover, it passes all the requirements as the good multimodal text (W/D). I can say with confidence that we have not only a great game but its website as well.
Hope that you liked my review of this website! See you soon and don't forget to try osu! (▰˘◡˘▰)
![](https://static.wixstatic.com/media/335d26_877f168839864be3a2f178564247f05c~mv2.gif/v1/fill/w_480,h_270,al_c,pstr/335d26_877f168839864be3a2f178564247f05c~mv2.gif)
Comments