RMIT University Vietnam

School of Science, Engineering and Technology

Course: COSC2652 - User-centered Design
Semester A, 2023

GROUP’S NAME: GROUP 6

Practical Arthur Tang / 8.30 / Wednesday / 1.4.016

Tutor/Time/Day/Loc

Video Link URL Demonstration video URL:

Group 6 demo video (YouTube)

1 Nguyen Ngoc Kim s3970589

2 Lee Jae Sung s3977739

3 Lam Uy Vu s3938804

4 Nguyen Huu Quoc Huy s3986423

5 Bui Minh Hoang s3818216

 TABLE OF CONTENTS
I. Introduction ........................................................................................................... 1
1. Topic ................................................................................................................. 1
2. Task Analysis .................................................................................................... 1
3. User Analysis .................................................................................................... 2
II. Prototype Design And Functionality .................................................................. 2
1. Home Page ....................................................................................................... 2
2. New Project....................................................................................................... 3
● Main screen .................................................................................................. 3
● Chat-bot........................................................................................................ 4
3. Prototype .......................................................................................................... 4
III. Evaluation ............................................................................................................ 4
1. What will we base on to take the evaluation? ................................................... 4
2. Empirical Evaluation ......................................................................................... 5
A. Plan for the Empirical Evaluation ........................................................... 5
B. The Evaluation Results .......................................................................... 5
C. The struggles of users ........................................................................... 7
D. What can we improve to make the website better? ............................... 8
3. Redesign Plan adjusted to the Empirical Evaluation ......................................... 9
IV. Reflection .......................................................................................................... 10
REFERENCE ........................................................................................................... 11
PEER EVALUATION………………………………………………………………………11
 I. Introduction
1. Topic
As game developers and gamers, the common problem we’ve seen among indie
game developers is late adoption of new engines due to wildly different UI from the
current ones they’re familiar with, even though the tasks and philosophy of game
development remain largely unchanged from engine to engine.

Our solution to this is an AI powered assistant specialized on game design specific

prompts by exposing any relevant component of the engine via means of in depth
documentation and autocompletion functionality akin to GitHub Pilot that are most
relevant to the game design request for a veteran game developer as well as
opening up technical and theoretical facets of game design to a novice game
developer.

We believe bigger, non indie game studios would gain the most out of this app, as
we would most likely require to work closely with them to provide an API for their in
house proprietary game engines. Rapid training for junior developers and adoption
for senior developers will be the use case for these big game companies.
Commercial, publicly available game engines such as Godot, Unity and Unreal
would be the launchpad for our application.

We’ll be employing the use of OpenAI’s GPT4 technology for its extensive user
research which can provide cheap and fairly accurate test user sessions as well as
feedback on the app itself. The recent surge in LLM development and advances
have greatly enabled junior developers everywhere, coupled with that is a growing
number of game engines make for a perfect combination of developers and AI to
increase their reach and ease into multiple game engines all at once.

2. Task Analysis
In the chat box component, the user requests a specific task to perform inside the
game, here they can include any additional information like scaling for added
customization. Based on the user's input, the app generates a solution and presents
this model to the user for review. The app prompts the user to provide any changes
or refinements they want to make to the output and the user can do so by following
up with a request, the app updates the answer accordingly. Once the user is

1
satisfied with the output, the user can now add the chatbot generated solution to
their project and the app goes on standby for more prompts to perform.

3. User Analysis
The app can suggest the most eligible approach to a user prompted task, provided
the user has a foundational level of programming skill to follow along. The potential
users are required to at least know how to code and moderately familiar with game
development.

Professional users are most likely to have used a multitude of engines before using
this app. They will most likely use it out of novelty, or speed up their learning process
with a completely new engine. Their profound knowledge means they’re more likely
to not agree with everything the app suggests, as its suggestions are more likely to
be grounded to beginner level and widely accepted solutions. Therefore, the app
must have a capacity to learn and adapt to user’s preferences to modify its output
appropriately for any scenario.

More novice users or enthusiasts will get the most use out of the app. The app will
serve as a baseline for their operations with the engine, forming a dependency with
it. As users grow, the app will need to cater that growing knowledge by making any
documentation readily available at all times, while maintaining conciseness of
information and relevancy to the prompted task. A “show more” option will be more
than sufficient as a solution to this.

II. Prototype Design And Functionality

1. Home Page
Our website's layout was thoughtfully created to be immediately accessible and
simple to navigate. Our homepage features the most-used and most-important
options for our users, such as "New project," "Import," "Settings," and "Help." If you
click on our logo, which is located in the upper left corner, you will be taken back to
the main menu. The drop-down menu next to it allows you to select the project you
were previously working on and display the available options. We also create the
DayNight mode to accommodate individual taste. The option to switch languages
appears next to it. Only Vietnamese and English are available at this time. To access
additional features, click the user icon in the top right corner.

2
The website has displayed all the information and features that users desire. For
example, When the users access the website, they will see multiple functions on
navigation bars.

The first function that we need to look into is the dropdown menu. It will lead the user
to 4 options: option one is a new project where users can create their own gaming
project and ask chatbot for any supportive needs. The second option is an existing
project which will display all the projects that you have saved. Help option is a page
where users can find all the answers and solutions to their problems. The setting
option will allow the users to change or adjust the functionality and behavior of the
application.

Another feature that will utilize globalization for the foreign user to use is changing
the language. By clicking the flag it will switch to English for foreign users to facilitate
easy comprehension. This will allow all users to access the same information.

Furthermore, an optional function that will improve vision for color blind users is the
Day-Night switch. Users can switch back and forth between dark and light modes
depending on the weather and environments they are in. dark mode helps the users
to read in the bright condition while the light mode helps users read in dark areas.

2. New Project

● Main screen
The top section of the new project screen contains a header navigation bar, with the
same logo as the homepage, and a tiny breadcrumbs on top, it also contains 3 sub-
menus items which are “Object groups”, “Properties” and “Layers”. Below that is the
main content section, containing a game editing window which will be the place
where the users interact with the game objects, changing layers and adding and
removing objects.

The users can click on the logo to return to the homepage or explore the sub-menus
options. “Object groups” open up the types of objects that the users can interact with
for them to choose, “Properties” show the properties of the object groups and
“Layers” let users change between the different layers of the current game projects.

3
 ● Chat-bot
Our chat-bot is located on the right side of the screen which users can easily see
and access. SIMPLE’s chat-bot is created based on the design of chatGPT which is
simple, flexible and functional. On the place of 20% of screen size, users or game
engine creators can search for information via the input at the bottom in order to
improve and learn new knowledge from the AI answers or even they can apply them
into their own projects.

Moreover, the AI not only answers the users’ questions but also suggests some
questions which users can use to specific their requirements, creating a demo, for
instance, this will help the user to understand more about what they are looking for;
in addition, saving time as well as rising the idea for the game engine creators.
Nevertheless, the chat-bot now is updating day by day to catch up with the
contemporary knowledge so that it can become an ideal assistant for many
outstanding projects in the future; thus, it may not respond to the requirements from
users as fast as ChatGPT-4 or other strong AIs in the world.

3. Prototype
People can access our interactive prototype via this link:
UCD_A2_Group6_Prototype (Figma.com)

III. Evaluation
1. What will we base on to take the evaluation?
Based on Nielsen's usability principles, the design team intends to do an interactive
evaluation session to evaluate the prototype's usability. Some of the 10 heuristics[1]
will serve as standards for assessment. The following principles will be examined:
user freedom and control, consistency and standards, error prevention (recognizing
errors rather than recalling them), aesthetics and minimalist design, support for error
recognition and recovery, and help/documentation. The design team will provide a
score of 1 to 5 to each principle, reflecting the seriousness of any problems that were
found. The group will use this criticism to make adjustments before the empirical
assessment. Additionally, the website's perceivability, operability, understandability
and robustness will be examined by utilizing online tools that study accessibility.

4
 2. Empirical Evaluation

A. Plan for the Empirical Evaluation

We are going to require the users to access to our prototype to do these tasks
below:

1. Changing the language from English to Vietnamese and vice versa.

2. Changing between Light mode and Dark mode.
3. Asking the chat AI for the Flappy Bird final demo pictures.

B. The Evaluation Results

Number of users had done the survey successfully: 5 people[2]

As shown in the result, all of the users had a quite similar experience with our
website’s prototype.

First of all, 80% of users noted that the goal of changing language is the easiest task
on our website, whereas, 20% thought that the second one, changing between light
and dark mode, is the easiest.

Picture 1: The easiest task

In contrast, 100% of users see the most difficult task is asking the AI chat-bot in
order to see the Flappy Bird prototype demo. Also, 80% of them rated this task at the
mark of 3, the last 20% rated it at 4.

5
 Picture 2.1: The most difficult task

Picture 2.2: Score of the task

However, it is an honor that we had a quite good rating from the users such as:

- The average of satisfaction rating is 8.4

6
 Picture 3: Satisfaction Rating

- The average of the easily in navigating the website rating is 7.8

Picture 4: Navigating Rating

- The average of the user-friendly rating is 8.4

Picture 5: User-friendly Rating

In conclusion, based on the result of the survey, people usually struggle in the
second and third task.

C. The struggles of users

Regarding the survey, users are still having some difficulties when using the website
via some of the tasks.

Firstly, in the second task, some of the participants have difficulties in recognizing
where the changing button is because the button design was quite hard for them to
find the changing mode button. In addition, they said that for the first time user, it will
not be a good experience if they do not have the guide from the developer team in
order to help them navigate the website smoothly. Thus, users may be stuck at the
home page and do not understand the next step they need to do.

7
 Picture 6: Struggles of task 2

Secondly, there are numerous problems in the final task which require a period of
step to see the demo of Flappy Bird. As the paragraph above, some of the users
were stuck at the home page and it took them a long time to recognize what they
needed to do to enter the AI chat-bot. Moreover, the small font-size of the text is also
an aspect which will make users disappointed with the website.

Picture 7: Difficulties of the final task

To sum up, the prototype still has a wide range of things that need to be upgraded
before it will be published for world wide users such as the text size of the AI, the
navigation button in the home page as well as the design of each button of the
website.

D. What can we improve to make the website better?

We will base on the suggestion of the testers in order to complete the website with
an outstanding design later.

8
 Picture 8, 9, 10: The users’ suggestions

3. Redesign Plan adjusted to the Empirical Evaluation

The prototype should, first and foremost, increase its responsiveness by making it
functional, as this is a critical usability improvement for all users. The buttons on the
home screen should all be leading to their designated page, and the editing window
in the “New project” should allow people to interact with it using their mouse. Also,
the most important component of the system, which is the chatbot, should actually
allow people to type their own questions and receive answers from it rather than only
being able to respond to pre-programmed questions.

Another design problem that needs to be addressed is consistency of the language

change feature and the light mode, they only applied the changes on the homepage.
Whenever you go to another page, it all changes back to the original setting. To truly

9
be able to have a proper translation and lightmode features, these issues will have to
be fixed as thoroughly as possible.

In the “New project” page, whenever the prototype changes to the next frame, the
editing window moves slightly. Even though this is a very small detail, its high
frequency could prove to be very annoying for the users and significantly decrease
the program usability.

Finally, according to the user’s survey, there were also minor design flaws like the
light mode button being too big but not obvious enough, or the chatbox being too
small. By fixing these seemingly minor details, we could improve the overall design
quality of the software prototype.

IV. Group Reflection

In this assessment, the workloads were divided for all members of the group. First of
all, Hoang gave us the idea of making the prototype of a game engine, that was the
reason why Kim let him do the introduction of the project. Whereas, other members
focused on developing the website prototype, Sung and Vu are in charge of
designing the homepage when making the main function AI chat-bot was contributed
by Kim, Huy was the person who designed the content on the main screen of the
“New Project”. Everyone worked extremely well so we completed the assignment
before the deadline, also, the lecturer, Mr. Arthur Tang, helped us with a lot of
explanations, via email when we had struggles, in order to make us understand more
about what we need to do in this assignment.

Finally, we had a last meeting to get the peer evaluation for everyone, and 100%
members agreed with the results and their contribution percentages.

10
 REFERENCE
[1] 10 Usability Heuristics for User Interface Design (accessed on 15/05/2023)
[2] Our user testing video (YouTube)
PEER EVALUATION
Declaration of Project Team Member
Project Team
Full Name Student ID Contribution Outline how this person contribute to
to the the outcomes of the project
project (%)
Making and writing the design and
Nguyen Ngoc Kim s3970589 20.5% function of the AI chat-bot, analysing
the survey’s results, collecting data and
writing the report. ( Project’s Leader ).
Writing and making the Home Page’s
Lee Jae Sung s3977739 20% design prototype
Writing and making the Main Screen of
Nguyen Huu Quoc s3986423 20.5% the New Project prototype, writing the
Huy Re-design
Writing and making the function of task
Lam Uy Vu s3938804 20% 1,2 and the navigation bar.
Ideation and problem-user analysis,
Bui Minh Hoang s3818216 19% writing the “Introduction”

I/we state that all information provided in this form is true and correct.

Group member’s name & signature Date

Nguyen Ngoc Kim 18 May 2023

Lee Jae Sung 18 May 2023

Nguyen Huu Quoc Huy 18 May 2023

Lam Uy Vu 18 May 2023

11
Bui Minh Hoang 18 May 2023

12