How to use mobile device's camera and microphone in business applications

Current mobile devices feature such tech specs, one could only dream about a few years ago. They provide great work optimization opportunities. Despite that, many of them are used in business scenarios only occasionally.

This article uncovers the utilization of mobile device's built-in camera and microphone in a photo documentation application that enables creating a voice tag.

Such application has numerous ways of usage. Practically, it is suitable for any kind of work force collecting data in the field. A good example is a Field Service solution, where a service technician fills out a report when being in the field. In such situation, the photo documentation describing a technical defect is an essential part of the report.

Another example can be a policeman or an insurance agent that uses mobile application for documentation of a car accident or an insurance claim.

Last but not least, the solution can be hosted, for instance, by a mobile operator that can include it in their portfolio of services adding interesting value for their customers.


Let's develop the application in Microsoft Visual Studio and .NET Compact Framework. In order to avoid complicated technology of picture and sound processing, we will use components from the Resco MobileForms Toolkit. These components dramatically simplify the overall development and save lots of time.

After running a quick brainstorming, this is the expected functionality our application shall possess:

  • Creating a new photo documentation project;
  • Adding a new photo image to an existing project;
    • Launching a built-in camera and picture capturing;
    • Picture editing;
    • Adding a voice tag.
When considering a data layer, we will use a combination of SQL Server Compact and file system. Here, the image and audio files will be stored.

Data scheme

image1.png

Creating a New Photo Documentation Project

Even though, I could use standard Visual Studio Components, e.g. TextBox and Label, for this form, I will employ the Resco component DetailView. Thus, a standardized design of my mobile application is guaranteed.


image2.png

The user has following options when creating a new project: a new project name, setting date, time and location, and adding a note. In order to save the project to the database click the 'Save' button in the lower part of the screen.

Adding a New Picture to the Existing Project

Each project can consist of multiple photo images. The user can assign a voice tag to each of them.

image3.png

A click to 'Capture' button in the lower left corner launches the application that manages the built-in camera. Furthermore, it allows the photo capturing itself.


Afterwards, the photo image is transferred to the application, where it can be edited by the user.

image4.png

To display a photo image, we will use a component Resco ImageBox. It allows photo editing and transformations. In order to offer these editing options to the user, we need a control element, such as Toolbar. A reasonable choice is a Resco component - CustomKeyboard.

image5.png

As you can see in the picture above, the user can use a stylish and easily operable keyboard with rich scale of editing options: gamma correction, brightness, contrast, resize, crop, rotate counterclockwise, zoom out, fit to screen, zoom in, rotate clockwise. After the user clicks one of the editing options, the keyboard is transformed to a new layout. The new layout enables performing the preferred changes. For instance, after I click a brightness button, following layout is displayed:

image6.png

Thereafter I can click the arrows to adjust the brightness until I reach sufficient quality.

image7.png

In order to perform sufficient photo quality, I can repeat the editing of other features. Once I am satisfied with the overall photo quality, I click 'Apply' button in the lower right corner, and the photo transformation is saved.


image8.png

Adding a voice tag to the photo image is simple - a single click to 'Click to Record' launches sound recorder.


image9.png image10.png

The record can be played back immediately.

image11.png

For this purpose was used a Resco component - Resco Audio. It allows sound recording and play back in multiple audio formats. The voice tag needs to be saved to be assigned to the photo image.


image12.png

In order to complete the Project, the user can add more photo images and voice tags in the same way as described above.
The final step is the project synchronization with server. This can be done by a single click to 'Sync' button in the starting form of the application.

Putting It All Together

The mobile devices dispose of a functionality that widens the usage opportunities one has never experienced in desktop environment. That is a great chance for developers to capitalize on these opportunities and offer new functionality to their customers - the functionality that enhances the quality of work of either the mobile workers or entire company.

Despite this example of modern mobile application is relatively complicated and uses many intricate technologies, such as data or audio processing, thanks to the components from Resco MobileForms Toolkit, the most of the complicated code is implemented directly with the components. And developers do not have to bother with a "low-level" code. The whole project, as described in this article, is available from Resco along with thoroughly commented C# source codes branded as Resco PhotoAssistant ESP.

About Resco MobileForms Toolkit

Resco MobileForms Toolkit is one of the richest and most comprehensive sets of Microsoft Visual Studio controls and libraries designed for developers of software solutions for mobile devices. In its portfolio there are controls and libraries that tackle most problems developers encounter in the mobile environment. Flexible keyboard, professional list control, powerful grid control, charting control, and scheduling control - to mention only the most frequently used ones.

For more information about Resco MobileForms Toolkit, visit http://www.resco.net/developer/mobileformstoolkit/default.aspx.

About PhotoAssistant ESP

Resco PhotoAssistant ESP is a prototype of mobile photo documentation solution. Using mobile device's built-in camera and microphone that allows adding voice tags and written notes to the captured pictures, the solution serves as a valuable assistant for field work force. Moreover, the solution provides back-office integration through Web Service and a Web Client that creates UI over the server database. Along with modern features, up-to-date technology, attractive and intuitive design, and vast customization opportunities, this prototype is a ground-breaking mobile photo solution.

For more information about Resco PhotoAssistant ESP, visit http://www.resco.net/enterprise/photoassistant/default.aspx.

The demo version is ready for download at http://www.resco.net/enterprise/photoassistant/download.aspx.


Similar Articles