Make ASP.NET Speak Typed Text

Introduction

One particular thing about most websites on the internet is that they are all silent! I mean they do not have the capability to talk to you :) You will understand as you read on...

One of the advantages if your website is Speech-enabled is that the users will not fix the screen and read whatever is written. They can now hear what has been written on the page. Also, it adds that little bit which makes it not like other formal and tradition websites. This article shows you how easy it is to allow your website to talk back to the user! We will make use of the Microsoft's Speech API (SAPI) to give our website such a power.

Getting Started with Microsoft's Speech API (SAPI)

SAPI has a text-to-speech engine (TTS) that we will make use of. In short, SAPI takes text as input and output an audible speech using TTS engine. By the way, every machine with Windows XP has SAPI and TTS.

SAPI is a COM component that needs to be referenced in the project.

Coding Voice Application

First of all, open Microsoft Visual Web Developer and create a new Website. Use the Visual Basic as language. Add a reference to your project. Website > Add Reference > COM > Microsoft Speech Object Library.

Image 1: Interop.SpeechLib.dll added to project

Now throw in a text box and a button on your webpage. It may look as below.

Image 2: Webpage containing a Multiline textbox and a button

The scenario we want to do is to make the computer speak what has been written in the textbox by clicking on the "Speak" button. Double-click on the button to add some code for the button. To access the DLL function, we have to import the namespace SpeechLib as below:

Imports SpeechLib

The next step is to create a SpVoice object.

Dim voice As New SpVoice()

And finally, you can make the computer speak for you!

voice.Speak(txtSpeech.Text)

Et voila! Oh, don't forget to switch on your speakers. Type in a text in the textbox and click on the Speak button. You should hear someone speaking.

Below is the complete little code snippet. By the way, always place your code in a Try..Catch block. Make this as a habit.

Imports SpeechLib
 
Partial Class _Default
    Inherits System.Web.UI.Page
 
    Protected Sub btnSpeak_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles btnSpeak.Click
        Try
            Dim voice As New SpVoice()      '   Creates the voice object
 
            voice.Speak(txtSpeech.Text)     '   Speak whatever is written in the textbox
        Catch ex As Exception
            Throw ex
        End Try
    End Sub
End Class

Now, you can play around with the voice object by exploring the different methods and properties that the voice object can expose.

Set of methods of the voice object

For instance, to speed up the rate at which the speaker talks, we can do:

voice.Rate = 10

A Little Bit of Fun

Now let us try to build a simple application from what we have learnt. We will make an application that makes us guess a number between 1 and 10 and making the computer as the jury. The computer will speak out whether the number we have input is too high, too low or correct. Firstly, create a new Website on ASP.NET web developer and build a simple interface like below.

Image 3: User interface

Also, include a label, name it as lblGuessedNumber and make it as invisible. This will store a randomly generated number.

Add the Speech Object Library Object as reference.

To generate a random number, we make use of the Random class. On Page_Load event we place the following code snippet.

    Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles
        Try
            If Not IsPostBack() Then
                Dim number As Integer
                Dim rnd As New Random()     '   Random number generator
 
                number = rnd.Next(1, 10)    '   Generates random number between 1 and 10
 
                '   Storing the random number in the hidden label
                lblGuessedNumber.Text = number
            End If
        Catch ex As Exception
            Throw ex
        End Try
    End Sub
 

Notice that the code is placed inside the Not IsPostBack() if statement as we do not want to generate a random number on every postback. Now, to validate the number that the user has input, we will make use of the following code snippet in the button's click event.

    Protected Sub btnGuess_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles btnGuess.Click
        Try
            '   Variables declaration
            Dim voice As New SpVoice
            Dim userNumber As Integer
            Dim computerNumber As Integer
 
            '   Parse the numbers and store then in integer variables
            userNumber = Integer.Parse(txtNumber.Text)
            computerNumber = Integer.Parse(lblGuessedNumber.Text)
 
            '   Speak the verdict
            If (userNumber < computerNumber) Then
                voice.Speak(txtNumber.Text & " is too low!")
            ElseIf (userNumber > computerNumber) Then
                voice.Speak(txtNumber.Text & " is too high!")
            Else
                voice.Speak("Cool man! You guessed the correct number!")
            End If
        Catch ex As Exception
            Throw ex
        End Try
    End Sub

The basic idea behind is to first parse the number in integer formats so that we can get a proper and clean comparison :)

Then you can output whatever you want based on the comparison using the voice object.

Also, it is interesting to note that the SpVoice class is intelligent enough to interpret and say the numbers. You can try out with negatives as well.

That was just an example to show you how the TTS engine can be beautifully integrated into applications. It can really give it another dimension and another feeling. Now, it is up to you to be creative and develop your own stuffs. Sample applications you can develop include: mail notifications, desktop alerts, welcoming messages etc... Note that the same techniques can be very well applied to .NET Windows application. The same class can be used.

The TTS engine is unfortunately under-used! However, really cool thing can still be done with it. Go and express yourself on the TTS engine!

Please note that the sources for the "Guess number Website" can be found zipped here

Tutorial toolbar:  Tell A Friend  |  Add to favorites  |  Feedback  |