Skip main navigation

How to turn your program into a graphical application

This article will walk you through the steps to turn your Pokémon program into a graphical application. Let's go.

Using the Python module guizero, you can add a graphical user interface to your Pokémon-fetching program.

A graphical user interface (GUI) is a visual way for users to interact with an application. guizero hides many of the difficult concepts for creating GUIs, making this an easy tool that learners of all ages can use to get started.


Create your first GUI


Your GUI will ask the user to enter the name of a Pokémon, download it using the PokéAPI, and display it.


The Pokémon-fetching GUI where the user has entered the name Pikachu, and an image of a Pikachu is displayed underneath


You are going to create the GUI first, before moving on to downloading the Pokémon and displaying it.



    1. Create a new Python program called



    1. Import App from the guizero module. App is the main window of your GUI.


      from guizero import App



    1. Create an App object.


      app = App()



    1. When the App has been created, it can be displayed by adding this line of code.





    1. Run your program. Your GUI should appear.




An empty window with the title guizero


You can customise the appearance of your GUI by setting parameters when the App is created, e.g. changing the title and the size of the window.


app = App(title='Pokemon Fetcher', width=300, height=200)


Add ‘widgets’ to your GUI


A GUI is made up of widgets (components) that are added to the App. A widget can be anything from simple text to a button.


Your GUI will use four widgets:



    • Text to show the message “Which Pokémon do you want to fetch?”


    • TextBox where the user can enter the name of the Pokémon


    • PushButton which when pressed will download the Pokémon


    • Picture which will display the image



An illustration of the Pokémon GUI application where the App, Text, TextBox, PushButton, and Picture widgets are labelled



    1. Additional widgets need to be imported. Modify your program to import the widgets by changing the import at the top of your program.


      from guizero import App, Text, TextBox, PushButton, Picture



    1. Add a Text widget to your GUI to display a message.


      app = App(title='Pokemon Fetcher', width=300, height=200)
      welcome = Text(app, text="Which Pokemon do you want to fetch?")


      Note: All widgets need to be created after the App, but before the App is displayed.



    1. Run your program, you should see your message displayed in the Text the widget at the top of your GUI.


      Pokémon-fetcher window, with the message displayed at the top



    1. Create the TextBox, PushButton, and Picture widgets after the welcome message.


      welcome = Text(app, text="Which Pokemon do you want to fetch?")
      input_box = TextBox(app)
      submit = PushButton(app, text='Fetch')
      icon = Picture(app)



    1. Run your program to see the widgets you added.


      GUI app with additional text box and button, the Picture widget is not visible




The Picture widget isn’t currently displaying anything so it’s “invisible”. To display the pokemon image you downloaded in the previous step you can set the image parameter of the Picture to the filename of the image. e.g.


icon = Picture(app, image="poke.gif")


Fetching your Pokémon


Each time the Fetch button is pressed, the image of the Pokémon whose name is entered should be displayed.


To display the Pokémon image, you will reuse the fetch_pokemon code you created in the previous step.



    1. Add the required modules at the top of your program.


      from pokebase import pokemon
      from requests import get
      from PIL import Image
      from io import BytesIO




In the previous example, you captured the name of the Pokémon to fetch using a input command. In your GUI, the user_input text box will store the name of your Pokémon. You can read the contents of a text box using its value property.



    1. Create a new fetch_pokemon function and get the name of the Pokémon from the text box. This function will be called when the button is pressed.


      def fetch_pokemon():
       name = input_box.value



    1. Add the code you wrote previously to download the Pokémon image and save it to a file.


      def fetch_pokemon():
       name = input_box.value
       poke = pokemon(name)
       pic = get(poke.sprites.front_default).content
       image ='poke.gif')



    1. You can now set the icon widget’s value property to the name of the file and display the image.


      def fetch_pokemon():
       icon.value = 'poke.gif'



    1. The final step is to change the PushButton widget to call the fetch_pokemon function each time it is pressed. You can do this by setting the command parameter when it is created.


      submit = PushButton(app, text='Fetch', command=fetch_pokemon)



    1. Run your program.


      The fetch_pokemon the function will run when the submit button is pressed. The image of the Pokémon is downloaded, saved, and then displayed in the icon image widget.


      Animation of the Pokémon name Charizard being entered and its image being displayed


You can find out more about how to use guizero at

This article is from the free online

Scratch to Python: Moving from Block- to Text-based Programming

Created by
FutureLearn - Learning For Life

Reach your personal and professional goals

Unlock access to hundreds of expert online courses and degrees from top universities and educators to gain accredited qualifications and professional CV-building certificates.

Join over 18 million learners to launch, switch or build upon your career, all at your own pace, across a wide range of topic areas.

Start Learning now