Design the User Interface

Create a new app using Text to Speech.

Step 1

TalkToMe is a fun, talking avatar that converts text to speech. You will create a text box that the user can edit and program the app to read out loud the text they type.

Open a new project: Choose Project > Start New Project from the top menu and give your project a name, for example Sarahs_Talking_App1.

If needed, re-connect your phone to App Inventor: choose Connect > AI Companion to re-connect.

Step 2

From the User Interface palette, drag and drop the Button component onto the Viewer.

Check that the button appears on your phone screen.

In the Properties pane, change the text for the button to “Talk To Me”.

Step 3

From the Media palette, drag and drop the TextToSpeech component onto the Viewer. It will appear in the area at the bottom of the Viewer marked Non-visible components.