I want to present to user with a "text to speech" function (similar to the google translate "listen" button).

I am thinking of a button showing a human face talking. Here is a self-made draft (yes the guy does look kind of scary).

enter image description here

Would that be self-explanatory?

Or what could be a great UX for such function?

3 Answers 3


I agree with Vitaly. The image you posted does seem like opposite to what you actually want to depict. These are some examples that you can use to come up with your own. They are pretty similar, but should give you an idea

enter image description here from http://practicalandroidapps.com/pdf_to_speech.php

enter image description here from http://storymind.com/final_draft.htm

enter image description here from https://labs.ericsson.com/developer-community/blog/text-speech-tts-api-released


I think that it conveys the exact opposite message - this is an icon for speech-to-text or for some voice-recognition software. Try a bubble coming out of a speaker or a computer screen.

  • That completely depends on the page it is used on. When found on a page were actions or commands are not usual, this could work fine.
    – Lode
    Mar 20, 2011 at 14:38

I'm guessing that you would place this symbol next to the text that will be spoken. If so, just a standard audio symbol is sufficient. The key here is context. You have text, an audio indicator will imply sound. Speech doesn't necessarily need to be called out.

Now, if you have some text with actual human recordings and other text with TTS generations, then I would use two different symbols indicating the type of audio being presented.

Not the answer you're looking for? Browse other questions tagged or ask your own question.