Mobile Home Interface Application PRESENTED BY:TEAM #10 Raffi Tikidjian CAMPUS : 6988 Sean Cahill CAMPUS : 8833

Topic Description The Mobile Home Interface Application (MHIA) enables users with the latest in home automation technology. Imagine controlling all the electronic systems in your home directly through your mobile device. As you walk through your house, MHIA will know which room you are in and automatically adjust for room-specific options. Assumptions Devices communicate via standard device protocol Mobile device subscribed to wireless service provider Mobile device has GPS functionality MHIA is trained on home configuration

System Requirements CAPABILITY/FUNCTIONALITY REQUIREMENTS The system shall be able to turn-on/start any compatible device. The system shall be able to turn-off/stop any compatible device. The system shall be able to pause/un-pause any compatible devices which are pause-able. The system shall be able to perform a numeric up/down/selection (1-9) function on any compatible device with numeric inputs (i.e. channel-up and channel-down on a TV). The system shall be able to schedule tasks on any compatible device. The shall be able to schedule one-time only and recurring tasks. The system shall have two modes of operation determined automatically based on the location of the user/device. Local – When a user is inside his/her home. Roaming – When a user is outside his/her home. The system shall perform real-time actions on the devices when commanded by the user. The system shall be able to auto-detect compatible devices and provide a default configuration for them. (i.e. similar to detecting a wireless network and auto-connecting) The system shall have two different views of browsing through the devices. Static View – All devices are displayed based on viewing preferences. Room-based View – Displays a customized room view of relevant devices to the room (i.e. within the physical bounds of the room or global devices to the entire home) The system shall be able to group devices by their location or type. The system shall be able to sort devices alphabetically, by location or type. The system shall be able to configure (add/edit/delete) compatible devices. The system shall track a personal profile of the user. INTERFACE REQUIREMENTS The system shall be a handheld device application. The system shall provide support for touch-screen handheld devices. The system shall allow the device list to be displayed in text-only or icons + text format. The system shall be able to use his/her voice to perform all actions available.

Navigation Map Main Application System Mode Roaming/Out-of-Home Local/In-Home System View Room-based View Static View Group-by Device Type Device Location Sort-by Device Type Alphabetical Device Location Control Panel Remove Device Add New Device Edit Device User Profile Generic Device Schedule Turn On/Start Turn Off/Stop Digital Device Numeric Selection (1-9) Numeric Up Numeric Down Pause-able Device Un-Pause Pause The following graph shows a top- level menu-tree-like hierarchical structure of how the user can move within the system that we plan to design. The system being designed is for a handheld device. It is ideal that the user will be able to view and access features without digging through many clicks. This is reflected in our tree structure having more breadth than depth. Briefly, there are three main components (sections) that you can classify the functions on the main screen. 1.Options related to the users viewing preferences (view type, grouping and sorting) 2.Options related to actions performed on an electronic device (on, off, up, down, pause, etc.) 3.Options related to the system configuration (devices, user profile, etc.)

User Analysis Discussion: User Profile

User Analysis Discussion: Dialogue Style

User Analysis Discussion: Task Analysis

User Analysis Discussion: Environment Most commonly will be used in the comfort of ones home. Its unobtrusive interface allows it to be used at work, even in corporate meetings. Voice recognition allows it to be used without direct contact.

User Analysis Discussion: I/O Devices Mobile handheld Pocket PC Stylus of Pocket PC Users Thumb Voice I/O

Visual Design: Summary Style Guide Menus Top Menu Standard 4 icons: back, home, browse, and time. Blue background Screen-specific options Tabular blue menus, with navy color denoting active tab. Icons Must be comic-like and animated. Icons must be scalable and recognizable from 0.25 to 1.25 of screen space. Direct manipulation screens Buttons will be light blue and liquid filled with white text. Device images must be within 0.5 to 1 of screen space. Font Font family is Comic Sans MS Menus and tabs will be 10 point. Fisheye menu items can range from 6 point to 20 point

Visual Design: Summary Style Guide Color System color are limited to 5: white, black, light blue, royal blue, and navy. Device icons are loaded from devices are out of our control; but should not have distracting colors. Spacing No overlapping icons At least 0.25 break space around each icon Voice Attractive feminine voice output

Home Screen Design Screen broken into 3 tiers Top menu Screen Display Screen-specific options Since our interface does not provide users with a keyboard, our design utilizes a lot of imagery in the form of icons. The icons are memorable and easily identified. Back button Home button Browse By name. By room. By favorites. Time Display of room diagram Adjustable by tabs. House is for devices through out house. The background is blue or white to maximize contrast. Our design uses 4 principal colors, which is in agreement with Aaron Marcuss 10 Commandments of Color. Perks Standard top menu across all screens. Backtrack from any location. Under three click search. Easily navigated. Breadth vs. depth negotiated.

Prototype: Home Screen The eyes icon brings up the Browse by menu with three search options: By Name By Room By Favorites Eyes are animated gifs and can track the styluss position. Navy color shows tab highlight, similar to windows XP. 2 nd floor tab will show 2 nd floor diagram House shows devices that are house devices; ie: sprinklers or house alarm.

Prototype: Browse By Name List display Browse by Favorite same screen type, but list is compiled by most used devices. Fisheye menu display. Three icons on bottom menu change display views, will be demonstrated in next slides. Easily recognizable after first use. Different displays work better on different lists. List display most space efficient, but only slightly visually appealing. Picked when many devices have to be listed; i.e.: after Browse by Name.

Prototype: Browse By Name Circular display All icons are gifs, but only the featured icon is animated. Information on the icon is also displayed; ie: on/off, current channel; etc. Most visually appealing display, key for our primary users. However, least space efficient. Picked when only a few devices are present; i.e.: specific room selected.

Prototype: Browse By Name Grid display All icons are gifs, but only the featured icon is animated. Information on the icon is also displayed; ie: on/off, current channel; etc. Mix between space efficiency and visual appeal. Picked when only a few devices are present; i.e.: specific room selected.

Prototype: Device-specific Controls The controls of the device are shown. Controls loaded from device. Used through direct manipulation Easy intuitive interface, since the user is already trained to use the device-specific controls.

Prototype: Device-specific Controls The controls of the device are shown. Image also loaded if available. Used through direct manipulation Ability to generalize the device use. All in house All in room Just this one. Also buttons in case direct manipulation of device is cumbersome. Black used for off and green for on.

Final Thoughts Tools Adobe Photoshop Microsoft Visio Microsoft Visual Studio.NET Lessons Learned User Interface Design for applications is the most time consuming portion of the development process Prototype early, Iterate often Artistic individuals required Plans for rest of semester Requirements Verification Usability Analysis Color Analysis Screen Designs Added/Improved Functional Prototype