UI elements

How can I make sepreated UI elements for my fellow team members to use?

Last week I did some research about home screens in game. This week I used my own product as a available product analysis. To create new Ui elements, which suits our games style.

This week I created a Quiz item for our game. I took in consideration the home screen design, which I created last week, when creating the Quiz item for the game.

Afterwards we got feedback from the teachers how I could make separated buttons without filling them in with icons or text, so that the devs could use it for places where they need it.

Of each button I created 3 variants. Normal, Pressed and Inactive. I also created one new prop for in game and updated the home screen UI.



And we decided to have a status, or better said, condition bar in our levels. To see the current state of the level. So I came up with a condition bar which is full and green at the beginning of the level with a green happy smiley. And when the condition lowers the bar turns red and the smiley turns sad. 

conclusion

I’ve expanded the look and feel of the game to the other screens. Which makes our game feel more like a whole instead of separate projects glued together. 

Comments

Post a Comment

Popular posts from this blog

2D isometric character design

Image
How can I create an character in 2D isometric art style? research Like the most researches I do I start with  Available product analysis . I like this method cause it gives me an overview of the already existing products. It also give me some inspiration. I’ve searched for character art in 2D isometric style. I came across a couple of samples. And with the knowledge from the previous weak I’ve started creating my own character. I did adjust the grid size on my view though, cause I needed more details in my character. In the research of last week I found out that creating rounded objects were difficult that why I decided to make a blocky character because of the details. Conclusion: I’ve created a character which suits our design and theme. The character can be seen in the image above. I was planning to upgrade the character design to a more rounded form. But I kind of like this style. So I will discuss this with the group. And if they agree we can keep this blocky character style.
Read more

Industry Project Kick Off

Image
Research strategies and methods used: Library Available product analysis Community research Literature study Workshop Brainstorm Industry project kick-off We kicked this week off with a presentation of an external client. The client is an insurance company. In short, the problem they have is that a lot of fire damage is caused by human actions. That’s why they want us to make a game which will teach the users how to prevent fire. After the presentation we wrote a debriefing and send this to the client. We did a brainstorming session about the game concept and documented this. And wrote an design challenge document together. After this we focused on the research question and the sub questions. We came up with the following questions: Main Questions: How can monetary damage in fire incidents be limited? Sub questions: What are the most common causes of fire? How can you apply technology to educate people about fire prevention? How ca
Read more

Designing the homescreen

Image
How can I make a good appealing and clear home screen for our game? Research: I started with  Available product analysis   I downloaded a couple of trending games from the Google Play Store. And did some research on how they created these home screens. I noticed that all the games have first a splash screen of their logo, or the company logo. And afterwards they show a loading screen. When the game is loaded we can see a home screen. The most games have a Play button and a settings button. Allot of stuff is hided behind the settings button.  I also noticed a theme music on most of the home screens. A lot of these games also have some kind of a connect to Facebook button. What also is worth mentioning is that all of these home screen fit in the main style of the game. I then did  Literature study  and came across a website in which they explain about different phone screen ratios. And why it’s important to keep in mind these different ratios. They also explain on how to do this.
Read more