Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.
Вивчайте Designing Home Screen | Створення Гри на Ловіння: Пакуй Рюкзак
Розробка Ігор з Cursor

Designing Home Screen

Свайпніть щоб показати меню

You are launching a new game called "Help Colin". Colin has overslept, the bus is almost here, and the user's task is to help him get ready by catching good school supplies while avoiding the bad ones. First, you will create a bright and friendly home screen that tells this story.

Download the prepared images (room.png, colin.png). Prefer to use your own assets? That's fine, keep the same filenames or update the prompt accordingly.

Build the home screen
expand arrow
  1. Create a new folder for the project (e.g., help-colin-game) and open it in Cursor (File → Open Folder);
  2. Place room.png and colin.png in the project root;
  3. Open a new chat in Cursor;
  4. Paste the prompt below and run it;
  5. Click Go Live to preview.
What the result should include
expand arrow
  • The background features room.png with a soft overlay to ensure the text is readable;
  • On the left side, there is a large image of Colin (colin.png);
  • The right side displays the game title along with a short, friendly story about Colin being late;
  • There is a primary action button that says "Help Colin!" which is big and colorful, and it will start the game later;
  • The overall mood includes floating school emojis for playful motion, with rounded, kid-friendly visuals designed to be responsive on both phones and laptops.
Note
Prompt in Cursor

We are making a playful game called "Help Colin". Colin overslept and must collect his school supplies before the bus arrives. The player will control a backpack to catch good items and avoid bad ones. For now, focus only on the home screen. Use the image "room.png" from the project root as the background and the image "colin.png" for Colin on the left side. On the right side, show the game title with a short, friendly story about him being late. Add a big colorful button that says "Help Colin!" which will later start the game. Include some floating school emojis in the background to add a fun touch. The entire design should be cheerful, kid-friendly, and visually appealing on both phones and laptops.

question mark

According to the prompt, what should be used as the background for the home screen in the 'Help Colin' game?

Виберіть правильну відповідь

Все було зрозуміло?

Як ми можемо покращити це?

Дякуємо за ваш відгук!

Секція 2. Розділ 1

Запитати АІ

expand

Запитати АІ

ChatGPT

Запитайте про що завгодно або спробуйте одне із запропонованих запитань, щоб почати наш чат

Секція 2. Розділ 1
some-alt