# How to use GUI-based answer environment

### Introduction

Students interact with CodeChum’s coding environment whenever they answer programming items in the activities created by their teacher.

It’s helpful to encourage students to get familiar with how CodeChum’s GUI-based environment works. The more they understand how to use it effectively, the more confident and prepared they’ll be for their next CodeChum activity.

### Typical GUI-based Environment Anatomy

A typical CodeChum GUI-based environment looks like this and has the following parts in it:

<figure><img src="/files/Qqqb2bsfCJPPjvAhitxr" alt=""><figcaption></figcaption></figure>

1. **Item Description** - located on the leftmost side of the screen, which contains the item name and the description of the item.&#x20;
2. **File Submission Zone** - located at the center by default. This is where students upload their solution files. Once uploaded, the system automatically checks the file against the test cases.
3. **Check Code**- A button located at the bottom of the file submission zone. When clicked, it submits the students’ solution to the system and returns a score based on the correctness of their output.
4. **Item Navigation** - one of the cards located at the top right corner of the screen. This allows students to view and switch between all items in the activity, making it easy to navigate from one item to another.
5. **Test Cases** - one of the tabs located at the rightmost side of the screen. It lists all test cases used to evaluate the submitted solution. If a student’s output matches the expected output for a test case, they receive a point.
6. **Bottom Navigation** - located at the bottom of the screen. This provides convenient “Prev” and “Next” buttons for moving between items within the activity.
7. **Messenger Support** - located at the bottom left corner of the screen. This feature allows students (and teachers) to reach out to CodeChum’s Customer Support Team for help with any technical or platform-related concerns.


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://help.codechum.com/teachers/getting-started/give-students-an-activity/how-students-will-answer-this-activity/how-to-use-gui-based-answer-environment.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.