WiFI Baby Monitor App

Page 1

EXERCISE1

Concept Brief

Interactive Digital Application Concept

FINAL

ITGM 705 Visual Interface and Information Design Summer 2010 | Professor David Meyers

Š 2010, All Rights Reserved. Intellectual Property of Tim Putt Interactive Digital Application Concept ITGM 709 Visual Interface & Info Design Spring 2010 Professor David Meyers

1


table of contents 3 5 6 9

FINAL

Project Details Application Intent Screen Shots Janet Murray’s Definitions

Interactive Digital Application Concept

ITGM 709

Visual Interface & Info Design

Spring 2010

Professor David Meyers

2


project details |

Interactive Digital Application Concept

OBJECTIVE Conceptualize an interactive digital artifact that demonstrates at least two characteristics of the digital medium as defined in Janet Murray’s essay, “Inventing the Medium.” These may be screen-based or interfaces embedded in a product. Your project should include the following components: 1. a one- or two-page artist’s statement that describes your interactive digital artifact, including which characteristics it embodies 2. no fewer than three screen shots or product drawings that illustrate use of the device. (These three images may be paper-based or created digitally.)

FINAL

You should develop an interface concept, not a functional (or even design-complete) project. You may use paper and pen or pencil, Illustrator, Photoshop, Freehand, or any other software. However, the focus of the project is on the interface, not the degree of visual polish applied to it. In conceptualizing your project, it is important that you have completely synthesized the two (or more) characteristics of the digital medium into an integrated, interactive whole.

Interactive Digital Application Concept

ITGM 709

Visual Interface & Info Design

Spring 2010

Professor David Meyers

3


project details |

Interactive Digital Application Concept

Process

Evaluation Criteria

1. R ead Janet Murray’s “Inventing the Medium” essay from The New Media Reader, which has been placed on XanEdu digital course pack. 2. C onceive of an interactive digital artifact that demonstrates at least two characteristics of the digital medium, as defined by Murray. 3. C reate at least three concept sketches for the interface of your artifact. These may be screen-based or interfaces embedded in a product. 4. Write a one- or two-page artist’s statement that describes your interactive application, including a discussion of the characteristics it embodies. 5. P ost your work-in-progress to the appropriate Unit 1 discussion forum by Day 4 for class discussion and feedback. 6. R eview the feedback provided by your professor and peers and make any desired revisions to your work. 7. P ost the final, revised version of your concept sketches and write-up as a single zipped archive via the Submissions link in the course menu by the end of Unit 1.

• The concept sketches should clearly convey the use of your digital artifact.

• The concept sketches and artist’s statement should clearly convey which digital characteristics your project embodies.

• The concept sketches and artist statement should convey a clear understanding of Murray’s four characteristics of the digital medium.

• You will be evaluated on the clarity and sophistication of your interactive idea. You will not be evaluated on the polish of the graphic design of this project. Hand-drawn projects are perfectly acceptable.

• Your artist’s statement should be well written and free of grammatical and typographic errors.

FINAL

Interactive Digital Application Concept

ITGM 709

Visual Interface & Info Design

Spring 2010

Professor David Meyers

4


application intent | SafeView is an iPhone application that will allow users access to their wifi monitoring cameras from their handheld device. The typical user for this application is a parent who is tired of the limited viewing of current baby monitors, the security threat of other cameras on the same frequency being able to spy on their children, the frustrating static of conflicting frequencies and the necessity of carrying around multiple devices. The interface is simple to navigate as well as intuitive for first-time users. It focuses on the basic needs of the monitor in the main navigation and hides additional functionality that can be explored at depth when the user is ready. Initial setup is the most technical aspect of the app as the hardware and software must be connected correctly (items like setting up DynDNS would have step by step instructions).

FINAL

Interactive Digital Application Concept

The main interface—once the cam has been setup—is located on the tab bar. Considering the orientation of most cameras is horizontal an option to view the menu items on a right, left or bottom orientation would be avaible. The controls include: Settings, SafeView (camera), Snapshot and Alerts. Settings tab allows the user to configure multiple cameras and tweak current settings for active cameras.

Snapshot captures a still shot of the current image to be saved and shared directly through email or mms. Alerts can be setup that monitor motion and sound activity. Using sensitivity levels, the user can have an alarm sound, and badges to interrupt “multi-tasking” features of iOS4.

SafeView displays the web cam. This screen allows the user to navigate pan/tilt/zoom cameras as well as adjust exposure and color settings of the image. This panel shows a visual indicator of audio levels in addition to the audio being relayed through the phone. Overlayed on the camera image are hotspots that give the user directional control. Arrows momentarily appear when this tab is selected however do not remain unless touched.

Interactive Digital Application Concept

ITGM 709

Visual Interface & Info Design

Spring 2010

Professor David Meyers

5


screen shots |

Digital Application

Arrows appear for 3 seconds and then fade away—the tapping motion over the image pans the camera.

FINAL

Interactive Digital Application Concept

Audio levels reflected visually.

ITGM 709

Visual Interface & Info Design

Swipe to view more cameras.

Spring 2010

Professor David Meyers

6


screen shots |

Digital Application

Expand or hide visual audio levels.

FINAL

Interactive Digital Application Concept

ITGM 709

Visual Interface & Info Design

Spring 2010

Professor David Meyers

7


digital sketches |

Digital Application

12:15 pm June 28, 2010

Shared image shows SafeView logo and the room name and time stamp.

FINAL

The sensitivity of audio/video that will trigger the audio alarms and badges.

Interactive Digital Application Concept

ITGM 709

Visual Interface & Info Design

Spring 2010

Professor David Meyers

8


digital characteristics |

Defining the digital medium

CHARACTERISTICS OF DIGITAL MEDIUM In Janet Murray’s essay she discusses Ceruzzi’s definition of the digital medium and the four characteristics: procedural, participatory, encyclopedic, and spatial. The SafeView app uses each characteristic of the digital medium and accurately reflects the criteria being analyzed. SafeView allows the procedural, participatory and spatial experience all at once through the control of the web cam. In addition the information can be saved, stored, and shared expanding on the encyclopedic characteristic. It definitely embraces all aspects outlined by both Murray and Ceruzzi.

FINAL

Interactive Digital Application Concept

ITGM 709

Visual Interface & Info Design

Spring 2010

Professor David Meyers

9


Turn static files into dynamic content formats.

Create a flipbook
Issuu converts static files into: digital portfolios, online yearbooks, online catalogs, digital photo albums and more. Sign up and create your flipbook.