As the lead and only designer for this project, I:
- Crafted the visual and interaction design for all of the screens.
- Created appropriate user flow documentation for Microsoft Design Reviews.
- Worked closely with developers as they implemented designs in an agile environment.
- Set up a design stencil for future design work.
Visual and Interaction Style
We could have created an custom app that looked exactly like other GoToMeeting offerings, or we could have created one only used Windows 8 base components. In the end, the app embraced Windows 8 components and principles to make it feel like it belonged on the platform and as a part of the GoToMeeting family.
Windows 8 Guidelines Usage
1. Navigation schemes. Windows 8 made bold decisions with their navigation schemes. Considering how pervasive the usage of these components across native Windows 8 apps, we wanted to take advantage of that user expectation in our own app. We implemented pivot tables and toolbars as a result.
2. Typography & sentence case. Segoe WP was specifically fine tuned for the Windows 8 phone platform - it didn't make sense to us to mess with it, especially since at the time we did not have one font we used across the company. We followed content case guidelines across the board.
3. Some iconography & components. Any default icons that we could repurpose, we did. Major common components we left alone, including text fields and animations.
Citrix Brand Usage
1. Color scheme & tone of voice. As a design team, we are confident that a product's color palette is a critical component of its identify across various media and platforms. GoToMeeting's tone of voice at the time leaned on the formal side, so we preserved it in this effort.
2. Custom components and iconography. There are certain portions of GoToMeeting that are important to the product. The display of meeting information is a good example - there is specific information that GoToMeeting needs to convey to the user about each meeting. As such, the out of the box list component that Windows 8 offered was not sufficient, so we adjusted. An even more critical set of components is audio controls: if your Internet fails and you lose your VoIP connection, you don't want to have to fumble to figure out how to dial into the session. A customized Audio screen, the visual design and interaction style inspired by multiple rounds of user testing from other GoToMeeting offerings, was introduced.
User Flowchart. This artifact documents the desired user flow for product team reference.
Stencil. When the project was done, I organized my files and main components into a design stencil for future work.
The first screen lists the user's upcoming meetings. From here, they can tap on a meeting to join it, or swipe to navigate to another pivot tab.