Virtual Town Hall - design doc


Published on

Design documentation for a new political/news online discussion tool, Virtual Town Hall.

Published in: Technology, News & Politics
  • Be the first to comment

  • Be the first to like this

No Downloads
Total views
On SlideShare
From Embeds
Number of Embeds
Embeds 0
No embeds

No notes for slide

Virtual Town Hall - design doc

  1. 1. Virtual Town Hall - Design Documentation Virtual Town Hall The new way to talk news and politics. Design by Alex H, Liz J & Jason S December 10, 2011 Table of ContentsPart I Overview................................................................................................. 2 Competitive Analysis: Target Audience.................................................. 3-4 Competitive Analysis: Industry................................................................ 5-7Part II Competitive Analysis: Similar Products & Competitors........................... 7-10 Inspiration Boards................................................................................... 10-12 Overview of Usage.................................................................................. 13-20Part III Wireframes.............................................................................................. 21-25 Mock-Ups................................................................................................ 26-27Part IV Design Rationale..................................................................................... 28-32 Audience Report: Plan & Prototype........................................................ 33-42Part V Audience Report: Summary & Key Findings........................................... 43-46Part VI Technical Plan......................................................................................... 47-48 Challenges, Questions & Outstanding Issues......................................... 49Part VII Evolution of Design................................................................................. 50 Further Implications................................................................................ 50-51Part VIII References.............................................................................................. 52-53
  2. 2. Virtual Town Hall - Design Documentation 2 Part IOverviewPeople interested in politics are more and more frequently using online media to become bet-ter informed, hear other viewpoints and exercise their voices. This application, called VirtualTown Hall, would provide this political discussion-thirsting audience a virtual social space topursue online political discussion about both federal and local issues in an involved, organized,ongoing way. It is an online interactive application that combines aspects of existing online dis-cussion tools (i.e. chat rooms, blogs, comment threads, message boards, etc.) and takes it tothe next level by centralizing the discussion format around data visualization, live conversationand an appropriate town hall theme. With the key audience of adults who enjoy discussing USpolitics and news in their free time, this medium is designed to improve the discussion experi-ence in a way that appeals to their needs. It also is optimized for online integration capabilitywith sites that this audience already congregates at, allowing opportunity for outside-accountsupport and for both user-generated content and commentary on already-existing content. Fur-thermore, this application incorporates other social and game-like features such as avatars,ranks and friends lists. It sets itself apart from other online discussion tools because of its spe-cial features, unique discussion format, and visual theme that creates a an appropriate contextfor the conversation. It could be the must-have interactive online installation of all news andpolitics-based media. With Virtual Town Hall, people who love talking politics can finally facili-tate live, thoughtful discussions at any time, about any topic, with anyone.This design document provides a general overview of the application and the design processbehind it. However, it primarily focuses on the unique chat feature--discussion circles.
  3. 3. Virtual Town Hall - Design Documentation 3 Part IICompetitive Analysis: Target AudienceVirtual Town Hall is designed for adults who are hungry for thoughtful U.S. political and news-oriented discussions--whether local or national--, and enjoy using online technology to pursueit. They are the people who have a favorite political blog in their Bookmarks Menu that theyvisit every free minute of the say. They are the people who want to have a thorough discussionabout the latest current events, but lack the convenience of people in the room with mutual in-terest levels in those topics. They are the people commenting on online news articles, castingtheir opinions on political blog polls, and e-mailing their Congressmen about their thoughts.Virtual Town Hall is a place where these people can congregate to have the satisfying discus-sions they desire.Common traits linking the target audience represented in the following user scenarios are: Enjoy reading about and discussing politics or news Feel unsatisfied with the quality of such discussions Want better accessibility of such discussions at any time Use the internet for communicating and/or researching Want their voices to be heard User Persona #1: The Local Activist Stephanie Miller Stephanie’s Daily Life & Problem... 1. Wakes up at 7:00am to drive her kids & neighbors‟ kids to school 2. Watches the cooking channel and surfs the web once kids are at school 3. Uses the internet on her PC to look up new recipes, e-mail her friends and play Farmville on Facebook 4. Meets with the school PTA to hang yel- 41 year-old mother low ribbons around town to advocate Lives in Paramus, New Jersey voting for the school budget In local school districts PTA 5. Feels unsatisfied by her close friends Did not attend college and husband‟s disinterest in discussing Enjoys teaching Girl Scouts, cooking, and the importance of local policy changes decorating 6. Encourages her 16 year-old son to do Subscriber to Womens Digest his Social Studies homework on those issues to spread the word Involved in the community Vocal at school board meetings and town council meetings
  4. 4. Virtual Town Hall - Design Documentation 4 User Persona #2: The Political Junkie Arnold’s Daily Life & Problem... Arnold Wilcox1. Wakes up at 5:00am to go to work2. Knows more lay-offs are coming; is wor- ried about the future of his company3. Browses news during his lunch break using the Huffington Post app on his Android Tablet4. Discusses the economy, last weeks‟ games, and the latest presidential cam- paign news with his buddies--throwing in  58 year-old professional statistics and crucial facts at every oppor-  Lives in Detroit, Michigan tunity  Works at a car dealership5. Vocalizes his strong opinions about  Attended grad school for business politics and current events to his brother  Married with 4 kids and wife at dinner, but feels like they  Works long, hard hours don’t care  Enjoys football, beer and reading6. Drinks a beer and watches the news before bed  Worried about the economy  Loves an intelligent talk about politics User Persona #3: The Political Activist Cristina Delores Cristina’s Daily Life & Problem... 1. Wakes up at 10:30am and checks her e- mail, Facebook and texts 2. Listens to MSNBC on TV while she gets ready for class 3. Hears controversial news about a presi- dential candidate, and searches the internet on her Mac to read more about it 23 year-old college student 4. Comments on an article, and checks up Lives in Brooklyn, NY on her comment for replies throughout Sociology major at Cuny Brooklyn the day on her iPhone Enjoys creative writing, volunteering, shop- 5. A professor brings up the issue in class, ping and painting and she is excited to express her opin- Owns Barrack Obama merchandise ion, but disappointed that her peers aren’t interested Is protesting at Occupy Wallstreet 6. Writes a note about it on Facebook, but Vocal in her classes and Debate Club only one person replies...and that per- Wishes she had a better outlet and reach to son‟s comment is a joke discuss political issues
  5. 5. Virtual Town Hall - Design Documentation 5Competitive Analysis: IndustryIt is growing more and more common for adults who enjoy engaging in politics and news butlack the proper outlet for it, to seek solutions to their problems through online media. They usesearch engines, news sites and political blogs to obtain more information--both from authorita-tive sources and other viewers. The Web 2.0 has transitioned those viewers into an authorita-tive role as well through the contribution of user-generated content based on their individualknowledge, experience and thoughts. Not only does this audience use the internet to accessmore information, but they additionally use it for communicative purposes--to discuss. Forums,blogs, chat rooms and social networks have revolutionized the way people can communicate.It‟s why this target audience will utilize online media to quench their thirst for quality politicaland news-related discussions.More importantly, political and news-based media has gained a heavy online presence. Tradi-tional media of TV broadcast shows, print newspapers and radio shows have integrated withinternet accessibility: digital articles, blogs, videos, forums, social media and more. A recentPEW Internet survey found that 79% of American adults use the internet and nearly half ofadults (47%), or 59% of internet users, say they use at least one social network--a nearly dou-ble growth in adult social media users since 2008 (Hampton). Because more and more adultsare using the internet, including social media, political media has made a point to integrate it.Furthermore, there is a correlation between social media networks and users‟ political activity--both online and offline. The following chart shows the relationships between users‟ political ac-tivity and the social media sources they use (Figure 1). Based on LinkedIn being the moststrongly correlated social network to political activity, it could be suggested that there is a
  6. 6. Virtual Town Hall - Design Documentation 6strong relationship between political activity and educated, career-driven adults who use so-cial networks for practical purposes (i.e. networking). Figure 1This trend is further demonstrated by the frequency of major political figures who use socialmedia to communicate with US citizens. For example, 80% of House and Senate membershave social media accounts, according to the Associated Press, which is 5% more than amongMillennials--the key demographic of 18-29 year olds. Similarly, President Obama has 23+ mil-lion Facebook “Likes,” and 2012 presidential candidate Mitt Romney has 93,000+ Twitter fol-lowers (Gurbaksh)..Over the past few years, this political online presence has become more and more of a func-tionality purpose to not only deliver information to the people, but also to facilitate discussionsand voice the people‟s opinions. It‟s become common for TV news programs to include “Tweet
  7. 7. Virtual Town Hall - Design Documentation 7in your response” or “Take the poll on our website” or “Post your comments on Facebook,” etc.There are even virtual town hall meetings taking place at both local and federal levels to wel-come people‟s voices and discussions (“Obama hall).What is important to note about this online integration is that it‟s not so much the number offollowers that matter most, but the types of engagements taking place (Howard). Adults havetraditionally used the internet to seek information. The problem is that there is so much infor-mation to access, without a well-organized way to narrow in on the issues they‟re most pas-sionate about. With the Web 2.0, they are also using it to voice their opinions. And in politics &current events, everyday people want the power to share viewpoints and exercise their voices.The need is even more apparent today, as evident by movements like Occupy Wallstreet,which was even started among social media outlets. People have grown skeptical of the main-stream media‟s reporting of information, and people have grown aggravated with having theirvoices unheard. This media would allow people to directly, in live-time, share information andhave their voices heard online at both local and federal levels, and do it in an organized waythat makes the information easily-accessible and the discussion high-quality.Competitive Analysis: Similar Products & CompetitorsCompetitive research took place regarding two aspects: 1) online political and news-based me-dia and 2) online discussion tools.Online political and news-based media: The following table compares some similar productsand competitors to “Virtual Town Hall,” which all contain elements that the design is derivedfrom (Figure 2). Some of the key points to take away from this comparative analysis are:  The most popular, mainstream competition have a heavy online presence in re- gards to web content, social media connections and blogs  With the exception of forums and chat rooms, most content is posted by a repre- sentative from the website, leaving comments and replies as the primary source of user-generated content  Blogs have much higher engagement rates than forums  Sharing features are highly utilized on news and blog sites  None of these similar products & competitors manage to incorporate social, discus- sion-based feature in an all-inclusive way; actions like reading, commenting, reply- ing, “Liking” and searching are all segregated among other media or purposes
  8. 8. Virtual Town Hall - Design Documentation 8Figure 2: Online political and news-based media Online discussion tools: Observational and participatory research was conducted among various sources of different kinds of online discussion tools. The primary strengths and weak- nesses we found among our research are highlighted in the following chart. Strengths Weaknesses  Friends list  Wall statuses don‟t lead to discussion Facebook  “Is typing...” feature in chat  No visual imagery to match the con-  @Tagging in posts text of the discussion  Can go back to read old posts
  9. 9. Virtual Town Hall - Design Documentation 9 Strengths Weaknesses  Chaotic, simultaneous responding  Contains various different conversa- Live tions within one group chat Chat rooms Ongoing  Infiltrated with sexual messages-- Progresses through group conversation especially when Private Messaging, No history of posts Voice Chat or Video Chat are used Can skin the webpage to fit a theme  Cannot distinguish who is actually present--whether responding or watching Indentations in threads organize the hierar-  Forces users to wait for responses chy of responses  Hi-jacked threads; topic-changers Messagebards Progresses through group conversation within a designated topic discussion Main page to organize different discussion  Unable to know who will see your topics response Can go back to read archived posts  Archived posts may, undesirably, ap- Can skin the forum to fit a theme pear in web search results  Forces users to wait for responses  Hi-jacked threads; topic-changers Indentations in threads organize the hierar- Comment threads within a designated topic discussion chy of responses  Unable to know who will see your Can go back to read archived posts response Ready-made audience; existing content  Archived posts may, undesirably, ap- sparks comments pear in web search results  Lack of follow-up conversation  Lag delay  Chaotic, simultaneous talking in Voice chat Live group discussions Conveys tone  Many users may feel uncomfortable More personal  Often infiltrated with sexual content  Difficult to moderate
  10. 10. Virtual Town Hall - Design Documentation 10 Strengths Weaknesses  Lag delay Live  Chaotic, simultaneous talking in Video chat Conveys tone group discussions Conveys facial expressions  Many users may feel uncomfortable Very personal  Often infiltrated with sexual content  Difficult to moderateInspiration BoardsThe following inspiration boards (Figure 4) gather visuals and references that have influencedthe central idea and design decisions. Key elements are summarized in the chart below, butsome of the specific references focused in on are:  Interactive maps with “hot zones”  Xbox Live avatars  Tag clouds  Zynga poker  Discussion circles Aspect Key Elements 1 Concept/Metaphor Town Hall Discussion circles Taking turns speaking at podium 2 Visuals/Aesthetics U.S. map Data visualization Discussion circles Icons Graphical Chat bubbles3 Interface, Navigation & Data or- Tag cloud ganization Levels of government/issues Chat windows - scroll, color-code, timestamps Circle Turn-taking4 Discussion Format Progress through conversation variations as a group Multitasking while conversing
  11. 11. Inspiration Board #2 - Visuals/Aesthetics Inspiration Board #1 - Concept/Metaphor Figure 4.2 Figure 4.1 Virtual Town Hall - Design Documentation 11
  12. 12. Inspiration Board #4 - Discussion Format Inspiration Board #3 - Interface, Navigation & Data organization Figure 4.4 Figure 4.3 Virtual Town Hall - Design Documentation 12
  13. 13. Virtual Town Hall - Design Documentation 13 Part IIIOverview of UsageThe following charts provide a general overview of how Virtual Town Hall will look, the featuresit will contain, and how it will function. Discussion circles became the primary focus of this pro-ject, so a more thorough explanation of the chat feature is highlighted. Creative Direction  Town hall theme Concept  A new way to discuss news and politics online  Simple and clean-cut look  Patriotic colors Visual Style  3D avatars  Data visualization and icons  Power to the people; have your voice heard Tone & Feel  Community feeling of people congregating Main Site Navigation Main Navigation Menus User Main Footer Avatar (w/ Rank) Home About Friends State FAQs My History Local Support Leaderboards Topics Contact Market Events Settings Search Login/Register
  14. 14. Virtual Town Hall - Design Documentation 14 Content: General Features Feature Action/Functionality  Contains site logo/bannerHeader  When clicked, returns users to Home page  Takes user to a basic account form to sign up for an account for the website.Register button  Users can register using several different internet IDs (e.g. Face- book, Disqus) Login button appears when a user is not signed in. Clicking it brings a dropdown menu that has the basic username and password formsLogin/Logout button as well as the ability to login through other accounts. Logout button appears when a user is signed in. Clicking it logs a user out of one‟s account, and hides the User Navigation bar. Allows users to search by keyword (based on topic tags) as well as by location. (For example, typing “Poughkeepsie budget” would gen-Search bar erate a list of results on a separate page that most closely relates to what was searched). Visible for logged-in users; hidden for users not logged in. Appears above the main navigation bar and below the header, register button, login/logout button, and search bar. Starting from the left, contains: 1. Avatar, Username & Rank: Clicking the avatar, username, orUser Navigation bar rank brings the user to his/her user profile settings.1. Avatar 2. Friends: Clicking it brings users to his/her Friends page, contain-2. Friends ing a Friends List and a Recent list of users from one‟s recent3. My History discussions with. Also allows user to start a Friend/Group chat.4. Leaderboards 3. My History: Brings users to a page displaying his/her recent dis-5. Market cussions and the information pertaining to them.6. Settings 4. Leaderboards: Shows the rankings of users filtered by town, county, state, nationally, and with friends. 5. Market: A place to purchase virtual items for avatars 6. Settings: Allows users to edit account settings
  15. 15. Virtual Town Hall - Design Documentation 15 Content: General Features Feature Action/Functionality Always visible. Starting from the left, contains: 1. Home: Returns users to Home page 2. State: Town Hall navigation by state -- Clicking this brings users to a list of all 50 states. Choosing a state then brings the user to an Interactive Map of the state-view, showing all the town halls in the state. When logged in, the user‟s designated state of resi-Main Navigation bar dency acts as the default state.1. Home 3. Local: Town Hall navigation by localized information -- Clicking2. State this brings up a form asking users for their zip code or town/city.3. Local Entering this then brings users to an Interactive Map of their local4. Topics district and the Town Halls that are discussing topics within.5. Events When logged in, the user‟s designated location acts as default. 4. Topics: Clicking this brings users to the Topics page, which con- tains all the topics being discussed all throughout the site in a tag cloud. These topics are curated based on when a discussion creator adds tags to his/her discussion. 5. Events: Clicking this brings the user to a list of special topic dis- cussions (e.g. debates, guest politicians, campaign-related, etc.)  Forefront of the Home page  Shows US map on Home page, state maps on State pages, and Local counties/towns on Local pages  Used to visualize and discover Town Halls having discussionsInteractive Map happening at any given time  Heat map--showing the most active discussions  Zoom-in and zoom-out feature that allows users to zoom in on a particular part of the United States to find discussions.  When hovered over, provides a brief explanation of the main content on given page (Interactive Map, Discussion Circle, TownHelp button Hall, etc.)  When clicked, brings users to Help page
  16. 16. Virtual Town Hall - Design Documentation 16 Content: General Features Feature Action/Functionality Supplements the Interactive Map by showing scrollable gradientColor Key/Activity Scale color scale illustrating the highest to lowest activity of discussions, with text for clarification. Always visible at bottom of site. Starting from the left, contains:Footer Navigation bar 1. About: Provides basic background information about the site1. About 2. FAQs: Provides functionality-based information about the site,2. FAQs and answers to frequently-asked questions by users3. Support 3. Support: Allows users to submit a support ticket4. Contact 4. Contact: Provides contact information regarding career-oriented, business, and miscellaneous inquiries Visible throughout the site for ongoing communications from the site and other users. Windows are scrollable, with the most recent in- stances at the forefront. Notifications and messages always have the host/username and timestamp, and sometimes are color-coded based on importance or category. Starting from left, contains:Tabs Window 1. Notifications tab: Streams basic site-based announcements ad1. Notifications notifications, such as upcoming events, when friends sign on,2. Friend/Group Chat and server announcements.3. Spectator Chat 2. Friend/Group Chat tab: Where private chats with friends and groups of friends takes place 3. Spectator Chat tab: Only visible when in a Discussion Room, where all users present--whether in the Discussion Circle or Spectator section--can chat freely. An ongoing Ranks system is a less-emphasized feature included. Users‟s ranks level up when their comments are voted on to be fur-Ranks ther discussed in Discussion Circles. The reward is status-oriented, for higher ranks are displayed to indicate high participation and qual- ity posts.
  17. 17. Virtual Town Hall - Design Documentation 17 Content: Town Halls Feature Action/Functionality  Shows 6 discussion circles on the screen at once with arrows in each direction that allows the user to scroll through every discus- sion in the town hall.Discussion Circles navi-  Each discussion circle shows the topic as well as how many Dis-gation cussion Circle spots are taken based on whether the circle is col- ored in or not. (Uncolored spots are open)  Clicking a Discussion Circle brings the user to that Discussion Room Always visible on a Town Hall page. Contains the following, from top to bottom:Town Hall information  Location: The name of the Town Hall, by locationwindow  Filters: Ability to narrow down viewable Discussion Circles Location through filters and sorting (e.g. maximum and minimum users in Filters room, tags, recentness, most popular, etc.) Create Discussion  Create Discussion button: Click to create a new Discussion Cir- button cle. The user will be prompted with an Options window (e.g. dis- cussion topic, ability to link to outside-site content, maximum and minimum users in room, etc.) and the ability to cancel creation Content: Discussion Rooms Feature Action/Functionality  Always visible in a Discussion Room. Lists the Town Hall loca- tion that the discussion is taking place in, as well as the Discus-Discussion Room infor- sion Topic.mation window  Leave Discussion Room button: Returns users to the page they were directed from upon entering the Discussion RoomUpon entering a Discussion Room, users are automatically placed in a spot in the DiscussionCircle. If all spots are taken, users are placed into the Spectators Window and automaticallyplaced in queue to join the Discussion Circle. Discussion Rooms vanish once empty of users.
  18. 18. Virtual Town Hall - Design Documentation 18 Content: Discussion Rooms Feature Action/Functionality Contains avatars and usernames of the users watching a DiscussionSpectators window Circle. They are ordered by their placement in the queue that they were automatically placed into, with an arrow pointing to the next The main discussion space, which follows a set format (Figure 5), containing: 1. Main Discussion window: A scrolling text box placed in the center of the Discussion Circle. The Primary Comment being re- sponded to at any given time is displayed at the top and remains at the top until a new Primary Comment takes its place. Re- sponses are displayed below the Primary Comment, simultane- ously. They remain until a Response is voted to become the nextDiscussion Circles Primary Comment. Each comment and reply is displayed in the1. Main Discussion font color correlating to the User Spot color of the user who sub- window mitted that discourse.2. Voting 2. Voting: Users in both the Discussion Circle and Spectators win-3. User Spots dow will Vote for the Response they desire to see as the next4. Typing Area & Primary Comment. They can Vote by clicking on either the Re- Check Box sponse, or the User Spot of the user who submitted that Re-5. User Drop-Down sponse. menu 3. User Spots: 2-10 spots are placed around the circle, based on6. Timer the options set by the discussion creator. They each have a dif- ferent color base, and a place for the user Avatar, Username & Rank. If a user is in his/her local Town Hall, his/her spot is distin- guished with a special marking. 4. Typing Area & Check Box: Visible only to the user who can type in the given Typing Area & Check Box. Appears close to that user‟s User Spot. The Typing Area can be typed into during Re- sponse Periods, and the Check Box can be checked and un- checked during Response Periods to indicate that one‟s Re-
  19. 19. Virtual Town Hall - Design Documentation 19 Timer reaches 0  Primary Comment (regarding Discussion Room Topic) shown minutes alone at top of Main Discussion Window Response with  Timer set to 2 minutes; Begins Response Period countdown most Votes be- comes Primary Comment Users type a Response to the Primary Comment in their Typing AreaBoth Spectators and Discussion Circle formatDiscussion Circle userscan read Responses Timer reaches All users inand Vote for that which 0 minutes Discussionthey want as the next Circle havePrimary Comment Check Box selected  Responses displayed under Primary Comment in Main Discussion Window  Timer set to 2 minutes; Begins Voting Period countdownFigure 5 Content: Discussion Rooms Feature Action/Functionality 5. Timer: A Timer is always visible outside the Main Discussion win- dow. It displays text indicating what is being counted down, and the actual countdown. Countdowns include: a) Response Period and b) Voting Period. Countdowns are set to 2 minutes, but canDiscussion Circles will be ended sooner than 2 minutes if and when all users in the1. Main Discussion Discussion Circle have indicated that they‟re finished replying by window clicking their Check Box.2. Voting 6. User Drop-Down Menu: Visible to all, each User Spot has a3. User Spots small arrow that releases a User Drop-Down Menu when clicked.4. Typing Area & The menu options include: a) Add as Friend, b) Private Message, Check Box and c) Report Abuse5. Timer 7. Reporting: Users can Report other users through the User Drop-6. User Drop-Down Down menu in a Discussion Circle, or through a drop-down menu menu option when clicking a Username in Spectator Chat win-7. Reporting dow. If several reports are receiving in a short period of time, the reported user is automatically kicked from the room. With re- peated reports over time, the user may be temporarily blocked from logging in to Virtual Town Hall.
  20. 20. Virtual Town Hall - Design Documentation 20 Access & Accounts  Web-based; direct access to site through web browser  Can be directed from “Discuss Live” button among sharing op- Accessibility tions on existing outside media  Can function stand-alone (blog widget, Facebook app, etc.)  HTML5; Cross-platform support for mobile and social networks  One-time creation of a customizable avatar  Can connect account with outside account used for LoginAccount Management  Login not required to browse, but required to manage an Avatar, Username & Rank, and to join Discussion Rooms
  21. 21. Virtual Town Hall - Design Documentation 21WireframesThe following wireframes show the basic layout and functions for the Home page, Town Halls,Discussion Rooms, and across-site menu bars and features.Home pageMain Navigation menu (appearance when not logged in)Main Navigation menu (with User Navigation bar; appearance when logged in)Footer
  22. 22. Virtual Town Hall - Design Documentation 22Tabs Window (with Notifications Tab selected)Spectator Tab is dimmed when inaccessible; only accessible when in a Discussion Room. Tabs Window (with Spectator Tab selected) Tabs Window (with Friend/Group Tab selected)
  23. 23. Virtual Town Hall - Design Documentation 23Town Hall Town Hall information/filters window Create Discussion formThe Create Discussion form takes the place of the information/filters window when enabled.
  24. 24. Virtual Town Hall - Design Documentation 24Discussion Room / Discussion Circle (all visible) This wireframe displays all the functionality. However, the Type Bar & Check Box would only be visible to the user it corresponds to. Two to ten User Spots can be included. User Spots are distinguished by different colors. User Spot & User Drop-Down menu
  25. 25. Virtual Town Hall - Design Documentation 25Discussion Room / Discussion CircleThe Type Bar & Check Box would only be visible to the user it corresponds to.User Spot, Type Bar & Check BoxThe Type Bar & Check Box is displayed next to the Avatar on the User Spot, and would bevisible only to that user. The Type Box extends as more space is needed.
  26. 26. Virtual Town Hall - Design Documentation 26MockupsThe following mockups illustrate what the site might look like, and may help clarify the wire-frames and processes involved. Logged-in display appearanceHome pageInteractive Map shows “heated” areas with Color coding of different tabshigh activity, supplemented by the Color and types of announcementsKey/Activity Scale Sample Icons
  27. 27. Virtual Town Hall - Design Documentation 27Discussion RoomEach User Spot is a different color, and their Spectators are orderedcomments/Responses in the Main Discussion as they‟re queued to beWindow correspond to the color of their spot. next in the Discussion Circle.The Timer should stand out, and its The Notifications Tab can be usedsupplemental text changes to match to provide an informative greetingwhether it‟s a Response Period or message upon entering DiscussionVoting Period. Rooms, helping new users to under- stand the discussion format.
  28. 28. Virtual Town Hall - Design Documentation 28 Part IVDesign RationaleVirtual Town Hall incorporates several key design principles and themes to optimize the targetaudience‟s usability with this online medium. Many of these focuses were honed in on afteruser testing with interviews and paper prototypes to gain a better understanding of what theusers truly face as a problem, desire in a solution, would have the easiest time using, andwould have the most enjoyable time using (Nielsen). Once the design principles and themescould be understood based upon this audience, they began to “guide design decisionsthroughout the remainder of the design process” (“User-Centered Design” 33).Design principles that lead design decisions regarding functionality, interface and aestheticsare described below. The six core principles driving Virtual Town Hall are:1. Familiarity2. Cross-platform compatibility3. Customization4. Visual imagery5. User compatibility6. Simplicity & visual hierarchy1. Familiarity is all about building on users‟ prior knowledge (Huang). The intended users are adults who already use the Web 2.0 for communicating with people, reading news and sharing opinions. Virtual Town Hall is centralized around familiarity because it draws ele- ments from all these different media--social networks, online news articles, blogs, message boards, chat windows and more. For example, the Upvote and Downvote feature is com- monly found across websites with user-generated content like Reddit and YouTube. Simi- larly, the scrolling chat windows simple icons as buttons are common in social media like Facebook and instant messengers. Tag cloud, often used in blogs and article hubs, is an- other familiar element. Building off the users‟ prior knowledge with all these online media elements is what will help them easily understand and enjoy using the functionality, and what will make them appreciate having all these elements incorporated for a highly interac- tive experience.2. Cross-platform compatibility is crucial for this design due to its core purpose: to bring peo- ple together. The intended users use the internet to read, share and discuss news and poli-
  29. 29. Virtual Town Hall - Design Documentation 29 tics. However, they all have different preferences when it comes to platforms, devices, spe- cific online media and accounts. So, cross-platform compatibility allows all users to congre- gate for the same purpose in the same space, but through the preferences of their choice. Whether they choose to access Virtual Town Hall directly through a web browser, use it as a Facebook app, get directed by clicking “Discuss Now” among share features on news sites, as a widget on their favorite political blog, or as an app on their iPhone, the cloud will support it. The compatibility with other account logins, like that of Facebook Connect or Disqus, will also bring convenience to the user experience. Futhermore, integrating with other online media will help direct more traffic to the app--and traffic that is meaningful and contributive to the social space.3. Customization appeals to this audience of independent thinkers. The ability to customize one‟s avatar is statistically an enjoyed trait among light PC gamers--a group who would likely fall into a portion of this target audience (NPD Group). In general, it also enhances the overall tone and feeling of individuality meant to be experienced when using Virtual Town Hall.4. Visual imagery is a key design principle that benefits the usability and sets this medium as unique from its similar products and competitors. Data visualization such as the interactive map makes accessing data a more sensible experience with meaningful context. Not only does the visual imagery make browsing information more memorable and enjoyable, but it also brings the nature of online discussion to a different level by visualizing the social space itself. In most discussion-based online media like forums, message boards and com- ment threads, random users have their responses stacked atop each other. In Virtual Town Hall, though, users are represented by game-like avatars in a circle, and their comment stays centralized with them. This creates a more meaningful social space to facilitate high- quality discussions.5. User compatibility is “perhaps the most fundamental principle.” It pertains to knowing the user--their psychology, strengths and weaknesses of the mind (Huang). In essence, Virtual Town Hall is a new way to facilitate discussions with others online, and it‟s based off incor- porating the most user-compatible aspects of already-existing online discussion media. This ties into most of the design principles already mentioned, and to the next design prin- ciple to be discussed: simplicity &visual hierarchy.6. Simplicity & Visual Hierarchy revolves around the creation of clear and simple interfaces
  30. 30. Virtual Town Hall - Design Documentation 30 that are easy for the audience to use (IBM). Such simplicity is applied to Virtual Town Hall through clear-cut graphic, the inclusion of some blank space, simple icons and visuals, and a logical visual hierarchy. For example, the discussion-starting user in a discussion circle will be in a space that is larger than the other spaces, and that person‟s initial topic will be placed in a scrolling chat box in the center of the circle that‟s also bigger than the other chat boxes. Similar to data visualization, this will visually communicate data to a user by indicating what‟s most important to look at first or to revolve conversation around.Other Themes revolving around the concept and nature ofVirtual Town Hall also affected design decisions. They wereconstantly referred back to whenever controversy over newsolution-based ideas were brought up. These themes are:1. Freedom of speech2. Live & constant conversation3. Data visualization4. Online integration5. Sense of community6. Mimic real-life conversation1. Freedom of speech revolves around a key purpose of this application: to have one‟s voice heard. The features should always support this theme, making it easier and more conven- ient for users to express themselves in an effective way.2. Live & constant conversation is a unique aspect of Virtual Town Hall that sets it aside from similar products and competitors. Visiting old comments on articles can create a discon- nected feeling from the content, and waiting for responses can feel lonely and even frus- trating. In today‟s society, when people are constantly connected, having constant updated content is a welcomed interruption. As Donald A. Norman explains in Emotional Design: “How much time does the interruption seem to take? To the person being interrupted, for- ever. To the person taking the call, just a few seconds. Perception is everything. When one is busy, time flies quickly. When there is nothing to do, it seems to drag. As a result, the person engaged in the cell phone conversation feels emotionally satisfied, while the other feels ignored and distanced, emotionally upset” (153). This is why people are constantly checking their Facebooks for notifications, and why many target audience members tested
  31. 31. Virtual Town Hall - Design Documentation 31 for Virtual Town Hall explained that they are constantly checking political blogs. The live, constant nature of Virtual Town Hall would satisfy that emotional need to be engaged in these kinds of interruptions.3. Data visualization--similar to the design principle of visual imagery--revolves around an- other key distinguishing factor from similar products and competitors. In most online dis- cussion tools, random users have their responses stacked atop each other, with their iden- tities only represented by a name and perhaps avatar places next to their response in the window. In Virtual town hall, elements like the discussion circles, unified conversation in the center, and general town hall theme are visually conveyed in order to reflect the kind of conversations taking place. It visually creates a social space that reflects the context of the conversation.4. Online integration--similar to the design principle of cross-platform compatibility--refers to building this application with existing online media in mind. A wealth of political and news- based online media already exists, and is more and more frequently integrating with social media and discussion tools, as highlighted in the competitive analysis (pages 5-8). This application‟s target audience is already frequently these other websites and tools, so it is designed to work symbiotically with them through elements like a “Discuss Live!” button among sharing features and a way to link existing content in discussion topics. Additionally, the ability for multiple-account compatibility, such as Disqus and Facebook connect, further allows this ready-made audience to expand upon their current online media habits with the inclusion of Virtual Town Hall.5. Sense of community is another theme kept in mind while carrying out design decisions. Most current online discussion tools make conversations feel random, and it‟s usually un- known who is reading one‟s contributions. Virtual Town Hall supports a more personal, community feeling through elements such as visual discussion circles, friends lists, cross- site friends/group chat and spectator chat, visibility of spectators, localized discussion places, and special events.6. Mimic real-life conversation is a theme that developed much later in the design process, but became an essential basis of the discussion room design. Several formats for the dis- cussion room were explored throughout the first several weeks of this project: it wasn‟t until the focus was shifted onto how real-life conversations work that a solution to the discussion room formats could be generated. Through observational and participatory research, both
  32. 32. Virtual Town Hall - Design Documentation 32real-life group discussions and conversations facilitated through online discussed toolswere studied. Additionally, secondary research from communications experts and philoso-phers were delved into as well. Between this primary and secondary research, the key ele-ments of unspoken-but-understood conversational rules we found were:  Turn-taking is necessary to avoid chaos  Gaps of silence will be filled  Thoughtful responses make better conversations  Everyone must stay under the same umbrella topic, unless noted otherwise  Slight deviations under the umbrella topic drive a conversation forward  Everyone in a group conversation must progress togetherPhilosopher Paul Grice discusses these key points in his book, “Logic and Conversation.”He refers to these rules as “conversational implicature.” It involves a flowing exchange ofdiscourse in which both participants cooperatively understand the purpose of their dis-course, whether it is initially established or changes throughout the conversation. Further-more, it is understood among both participants that certain elements of conversation wouldbe inappropriate: it is understood that certain rules govern conversation, and assumed thateach participant will follow such rules (Grice 26-27). These rules of conversation guided thediscussion room format design until a solution was finally reached.
  33. 33. Virtual Town Hall - Design Documentation 33 Part VAudience Report: Plan & PrototypeFirst Series of User Testing: The first audience research report led users through a series ofquestions regarding demographics, then how they discuss topics and use technology, followedby questions incorporating their involvement in politics and news. The following questions weredirectly asked in Round 1 of testing, but were only used as a guideline for a more open inter-view format in Round 2 testing:A. Demographics (Gender, Race, Age, Marital Status, Location, Occupation, Income)B. General Interests/Behavior/Psychographics: 1. How do you enjoy spending your free time? 2. Do you consider yourself more of a talker or listener? 3. What subjects do you enjoy discussing? a. Who do you like to talk about those subjects with? i. Are you satisfied with your discussions with them? ii. Are there others you wish you could discuss them with? b. How do you like to facilitate these discussions? (e-mail, phone, instant messaging, texting, in person, etc.) i. Is there another way you wish you could discuss them? c. How often do you discuss these subjects? d. Do you consider yourself an active participant in these discussions? e. Are there subjects you wish you could more thoroughly discuss? f. Do you ever feel frustrated or disappointed with the discussion process of these subjects? Why? i. Is there a better way you can think of to discuss these subjects? 4. Do you have internet access? a. What are your devices used for accessing the internet? b. Where do you use the internet most often? c. What do you mostly use the internet for? i. How often do you use the internet for these purposes? d. Which, if any, social media sites do you use? i. How often do you use them? ii. How do you use them? (Do you use applications? Do you use it to discuss subjects?) 5. Have you participated in an online chatroom, forum, or message board? a. How often do you visit them? b. When do you typically visit them? c. Do you generally post or read? d. What do you like about how this medium works? e. What do you dislike about how this medium works? 6. Do you discuss Politics or News with anyone? a. Who do you discuss it with? b. How often do you discuss it? i. What topics do you discuss? ii. Are they recent topics, or older topics? iii. Are they more national or local news? c. Do you feel it is difficult to find people to intellectually discuss said news or politics?
  34. 34. Virtual Town Hall - Design Documentation 34 d. Do you feel satisfied with these political/news-oriented discussions? e. How comfortable do you feel discussing news/ politics with strangers? f. What would be the ideal way for people to discuss politics and news? 8. Do you ever attend town hall meetings? a. Why or why not? b. What do you find beneficial about the town hall meeting format? c. What do you find unfavorable about them? d. How do you think they could be improved? e. What do you think about the idea of a virtual town hall?After these questions were asked, users were lead through the paper prototype. The questionsasked primarily tested its usability regarding familiarity and navigation, and likeability regardingthe concept and user needs. In Round 1 testing, users were asked follow-up questions abouttheir experience. In Round 2 testing, users were simply asked free-form questions during theprocess and made comments.1. Show map interface2. Ask them which state has the most active discussions3. Tell them to go to your hometown (say it‟s Poughkeepsie)
  35. 35. Virtual Town Hall - Design Documentation 354. Ask them what are the topics being discussed right now at the town hall5. Tell them to click circle discussion on “Should the school budget be passed?”6. Ask them whose comment do you think has most credibility?(Jen‟s comment will be distin-guished by color).7. Ask them how they would show support or dislike for Jen‟s comment on passing schoolbudget.8. Tell them to participate/make a comment in one of the discussions.
  36. 36. Virtual Town Hall - Design Documentation 369. Ask them who responded to their comment.10. Tell them to search for a topic discussion for illegal immigration in California.
  37. 37. Virtual Town Hall - Design Documentation 3711. Tell them to find where the most discussion of illegal immigration is within California.12. Tell them to search for other topics.13. Tell them to look for discussions on health care.
  38. 38. Virtual Town Hall - Design Documentation 3814. Tell them to go to town hall where federal issues are discussed.Prototype Follow-Up Questions(KEY: 1=Strongly disagree, 2=Disagree, 3=Neutral, 4=Agree, 5=Strongly Agree) 1. It was easy to navigate from map interface to town hall discussion. 1-2-3-4-5 2. It was easy to like or dislike a town hall discussion comment. 1-2-3-4-5 3. The functionality of the Poughkeepsie town hall could be easily understood upon en- tering it. 1-2-3-4-5 4. Users can easily participate in town hall discussions. 1-2-3-4-5 5. Opinions can be voiced in town halls. 1-2-3-4-5 6. Opinions can be heard in town halls. 1-2-3-4-5 7. The user ranking system is easy to understand. 1-2-3-4-5 8. The user ranking system seems fair. 1-2-3-4-5 9. It was easy to recognize which state had the most current activity. 1-2-3-4-5
  39. 39. Virtual Town Hall - Design Documentation 39 10. It was easy to search for a topic. 1-2-3-4-5 11. It was easy to recognize which town hall within California had the most active dis- cussion of illegal immigration at that time. 1-2-3-4-5 12. It was easy to navigate to the federal town hall. 1-2-3-4-5 13. How do you prefer to navigate to different town halls? a) By clicking on the interactive map b) By using the side panel options 14. What platforms would you use to access this app? (Check all that apply) a) Computer (browser) b) iOS device c) Android device d) Facebook e) None of the above 15. Do you have any general feedback about your experience with this product? 16. Do you have any suggestions to make this product design better?Second Series of User Testing: A second, revamped prototype was created for user testingpurposes later in the design process. This prototype was a real-life reenactment of how thediscussion format of a discussion circle would work. A group of seven Marist College studentsparticipated. Five sat around a round table, and two stood behind the table as spectators. Eve-ryone was given a quarter to use for voting, and the five students sitting at the table were givenpaper and a different color marker. A timer was placed in the center of the table, along with thediscussion room topic. This topic--a fake news article about a made-up alcohol policy affecting college campuses in Poughkeepsie, was generated as the main topic. The purpose was to choose something relevant, that these users would want to express their opin- ions about. The fol- lowing Poughkeep- sie Journal article was used as a vis- ual asset.
  40. 40. Virtual Town Hall - Design Documentation 40Next, the timer was set to two minutes, and the four participants at the table were asked writetheir response. The fifth participant is a planted participant who started the first comment,shown to the right. These participants were also told to put their marker down when they werefinished (to symbolize “checking” that they are done “typing”).After the two minutes was up, the partici-pants together placed their comments inthe center, under the main comment.Then, both the discussion participantsand spectators were given two minutes toplace their quarter on (“vote” for) the com-ment they want responded to next.
  41. 41. Virtual Town Hall - Design Documentation 41
  42. 42. Virtual Town Hall - Design Documentation 42Next, the comment response with the most “votes” was placed at the top, the other commentswere cleared away, the timer was reset to two minutes, and the participants were told to repeatthe process. One slacker response (“meh”) was planted for the sake of testing moderation.While they “typed” their comments, the user whose comment was being replied to “chatted”with the spectators.Again, the process was then repeated. Afterwards, the users voluntarily gave feedback, andthen were asked specific questions about their feelings toward the process.
  43. 43. Virtual Town Hall - Design Documentation 43Audience Report: Summary & Key FindingsSummary of Series 1: Round 1 Audience ReportThe first round of interviews and user testing mostly focused on younger users. The age rangewas 20 to 51 years old, with 30 as the mean age.Users were asked a series of questions first about their demographics, then about general in-terests and discussion behavior, followed by more specific questions pertaining to their tech-nology usage and involvement in politics/news and local government. After these questions,they were lead through the paper prototype, which primarily focused on the usability and like-ability of how it functions both technically and conceptually. Finally, they were asked follow-upquestions about how they felt about the process of using the prototype, including specific ques-tions about specific features which they mostly rated on a Likert scale.Some of the key findings of the Round 1 Audience Report included: Lacking equally-passionate people to discuss topics of interests with can be problematic to the satisfaction of those discussions They desire a larger network of people to discuss academic/intellectual topics with Most intellectual discussions take place in school and work environments Many people have multiple social media accounts, but barely use them Regarding political/news discussion, students often feel they are in a bubble at school and, in general, tend to share outlandish stories Simplicity in layout of forums/message boards is important People‟s will to talk with strangers online depends on the level of anonymity; some kind of identification representation is helpfulAlterations & Methodology in Series 1: Round 2 TestingThe second round of interviews focused in on an older audience than Round 1. The age rangewas 21 to 80 years old, with 52 as the mean age.The methodology was slightly altered from Round 1 testing (described above). The same pa-per prototype was used, but some questions were added to gain better insight into the usersentiment about the product. Also, more preliminary and follow-up questions were added thatfocused more on the rationale behind behavior. The entire audience research plan was refor-
  44. 44. Virtual Town Hall - Design Documentation 44matted so that it could be distributed as either a print-out or interactive PDF, in a way thatwould be self-explanatory to users. However, after having the first user complete the survey--which was quite long and left unfulfilled opportunities to ask even more follow-up questions--the testing process was again revised. Instead of filling out the the audience research plan, itwas simply used as a guideline when openly interviewing users. This allowed for more users tobe tested, more pertinent responses to be narrowed in on and followed up on, and some grouptesting to take place.Key Findings of Series 1: Round 2 ResponsesGeneral Findings: Adults age 20-65 is primarily the core audience inclined to discuss on online media Responding to content that already exists (blog posts, articles, etc.) is important, but limits the ability to generate own content Facebook, especially to middle-age adults, is often viewed as an unfavorable outlet to actu- ally discuss topics, but a good way to connect with othersPolitically/news-active Middle-age Adult Findings: Use news sites and political/news-based blogs as a place to seek information and express their opinions (again, through blog posts, article comments, etc.), and browse these fre- quently throughout the day Cross-site usability of an identity (account & avatar) is important Interest in both national and local issues Open to the idea of phone-in and virtual town halls, where government leaders conduct their town hall meetings in an open format that invites citizens to call-in/submit questions to be answered live Live conversation is importantStand-out Quotes: “I hate Facebook. I have one, but never use it.” (Why?) “Because it‟s not a conversation-- it‟s just people talking to themselves.” (Why don‟t you attend town hall meetings?) “I‟m lazy, but I bet I‟d have some things to say.” [after explaining prototype] “I would LOVE that!...except I‟d never get anything done be-
  45. 45. Virtual Town Hall - Design Documentation 45 cause I‟d always have people to talk to [laughs].”Prototype Feedback User-generated discussions about politics/news would be unique and beneficial Likability towards the map interface Having all federal/national news discussion in D.C. would be overwhelming with the amount of people talking live in there. It was also difficult to locate. Solves the problem of hi-jacked threads Likes that it‟s live Need a way to post linked content to share Would want a way to read older comments/discussions Make sure stringed comments don‟t get too small in font size like they often do on com- ment threads Need a larger selection of topics, and a way to address the dynamics of how their popular- ity changes at different times Idea of some kind of friends/buddy list, or way to favorite users, so that you can see where they are and go talk with themDesign Changes Implemented Due to Series 1 Results Ability to ask government officials their questions (Events) More fluent incorporation of both federal and local politics More integration with online content (articles, videos, websites, etc.) and accounts A way to read older comments/discussions (Scrolling chat boxes rather than just comment bubbles that disappear) More structured discussion format with turn-taking and limited spots per circle, so that the screen isn‟t too crowded, the text isn‟t too small, and one can keep up Use of a tagging/key word cloud when browsing topics, which is constantly updated be- cause it‟s derived from key words in live discussions Implementation of a friends/buddy list with social features Shifting the focus from creating competitive ranks and game-like features, to instead opti- mizing their experience of spending quality discussion time
  46. 46. Virtual Town Hall - Design Documentation 46Key Findings of Series 2 TestingThe Series 2 user testing had college students do a real-life paper prototype of how the re-vamped discussion circle format would work. They expressed overwhelmingly positive feed-back before follow-up questions were asked. With the help of follow-up questions, these arethe specific aspects they approved of:  Time limit  Discussion format -- How a discussion actually works, with everyone progressing through the conversation together  “Voting” on replies -- Fun to lead the direction of the conversation, while still reading what everyone has to say  Ability to talk to spectators and multitask in downtimeWhile these aspects of the redesign were praised, one user did point out that moderation couldbe an issue, because unsubstantial comments like “meh” can bring down the quality of a dis-cussion. However, another user expressed that overly-moderating would be worse than lettingsome of those comments shine through. (“After all,” as she said, “real-life discussions aren‟tcensored that way. I know someone who would say „meh‟ in real conversations sometimes. Soa little bit is ok.” After hearing this feedback, we asked what they thought about being able toreport a person in the group for a problem--whether it‟s an immature comment or going idle.They said that if several people in the group reported someone and then that person waskicked out, it‟d be a good and fair balance.Overall, the feedback was very positive. All the users expressed that it was a fun and interest-ing way to facilitate discussions, with a nice sense of community. They all said they‟d use thisapplication in their free time.
  47. 47. Virtual Town Hall - Design Documentation 47 Part VTechnical PlanThere are several aspects of this application which require special technical attention:1. Cross-platform compatibility2. Storage/hosting3. Tagging & live data displays4. Server notifications window5. Voting functionality & rank system6. Moderation functionality1. Cross-platform compatibility: This project needs to work on multiple devices (e.g. desk- tops, laptops, tablets, mobile phones, etc.), browsers (Chrome, Firefox, Internet Explorer, Safari, etc.), and screen resolutions. Furthermore, outside account compatibility and site button embed features must be made possible. HTML5 would be the most efficient way to make this possible, to use for the coding architecture for the site. HTML5 is a web-based language, so it can create browser-based products without user-end problems: it can work across any device. All in all, HTML5 is extremely flexible and can be used to create every- thing from video, to the design, to the discussion interface.2. Storage/Hosting: It is integral to the functioning of the project that it is stored securely, with multiple backups, and allow for potentially millions of users to access this website at a time. Amazon Elastic Compute Cloud (Amazon EC2) is a strong choice to consider be- cause it is storage based in the cloud. It is therefore much cheaper than building infrastruc- ture for web servers or hiring a company for web storage. Also, payment is only required for the for the usage and traffic actually consumed. It also includes backup of physical stor- age, so the cloud isn‟t completely depended upon.3. Tagging & live data displays: Tagging and live data congestion interpretation will be needed for the topics tag cloud and the map interface data visualization--both which dem- onstrated which topics are being heavily discussed at a given time, and where they are be- ing discussed heaviest. It will tie in with the textual scale as well.4. Server notifications window: A notifications window, including a tab for server notifica- tions, will be displayed across the site. It must support live notifications, such as discussion room action narration, friends list-related notifications, and server announcements like spe-
  48. 48. Virtual Town Hall - Design Documentation 48 cial events.5. Voting functionality & rank system: In discussion formats, both discussion participants and spectators in the room will be able to vote for which comment they‟d like to see as the next main comment to respond to. They should be able to do this by clicking either the us- ers or the user‟s response comment in the centralized discussion window. All votes will contribute towards the user‟s ranking.6. Moderation functionality: Users will be able to report abusive behavior in discussion cir- cles, friends/groups and spectator chat, and with private messaging. The results of reports should be immediate (after a given concentration of reports from different users in a spe- cific time period), and should be as automatic as possible--such as booting users out of discussions or causing temporary application access blocks.
  49. 49. Virtual Town Hall - Design Documentation 49 Part VIIChallenges, Questions & Outstanding Issues1. Moderation - Given the nature of this application, moderation may be one of the most chal- lenging issues to face. To eliminate dependence upon moderators, an algorithm will be im- plemented to work in conjunction with the report abuse function. That way, users can be automatically kicked out of discussion rooms or temporarily banned from logging in by IP address. However, moderators will likely still be needed to review special cases. Addition- ally, the algorithms will need to be tested in order to determine appropriate specifications.2. Time limit testing - User testing results have supported the notion of using the timer feature for response periods and voting periods in discussion rooms. However, the time limit of two minutes was arbitrarily chosen based on an educated guess. So, more specific user testing will need to be done, using typing rather than writing, to determine an appropriate time limit.3. Discussion circle spot cap testing - User testing results have supported the notion of limit- ing discussion circles to a given number of people, in order to facilitate quality discussions and avoid chaos. However, the maximum number of user spots in these circles was arbi- trarily chosen as 10 based on an educated guess. So, more specific user testing will need to be done to determine the most appropriate number to cap it at.4. Details on other aspects of application - While a general overview of the application fea- tures was provided in this documentation, the discussion rooms chat function was primarily focused on. The other features need to be more thoroughly thought-out and outlined in greater detail.5. Loading times - Loading times could potentially be an issue. This could be attributed to the application‟s focus on being live, connected with outside content, and using visual displays of constantly-updated data (i.e. interactive maps, topics by tag clouds, etc). An over con- gestion of users would cause lag problems as well.6. Impatience in discussion rooms - Even with the positive user testing results, it is difficult to perceive whether or not users will experience any moments of frustration or bore in discus- sion circles--especially in full circles. Most of the feedback about time limits has been posi- tive, and users have overall said they like the ability to multitask in downtime. However, only a small amount of user testing was done, so this could still come up as an issue detri- mental to the chat function design.7. Unrewarded ranks - The weight of ranks was decreased based on user testing results. However, ranks may seem random and unnecessary without a greater reward.
  50. 50. Virtual Town Hall - Design Documentation 50Evolution of DesignThis design evolved very far from its origin--a Facebook game called “Political Fury.” This tablesummarizes some of the key game-changer milestones reached during the design process,and the design decisions they directly impacted. GAME-CHANGER DESIGN DECISIONS Focus on political/news themeSpecified target audience Concentrate on online discussion tools Implement events with guest politicians Increase integration with online contentSeries 1 User Testing - Questionnaire Implement friends list Shift focus from games to discussions Blend federal &local politics together more Implement historySeries 1 User Testing - Prototype Discontinue disappearing chat bubbles Make the chat format less chaotic Prevent chat text from getting too small Lift Login/out, Register and Search bar above Avoid blue & red as signified color codesClass feedback on wireframes Create a better chat format & flow Consider discussion culture & norms Focus solely on chat; disregard featuresObservational research on discussions Found solution to chat format Confirm idea through positive feedbackSeries 2 User Testing - Prototype Confirm importance of other features Be mindful of possible moderation issuesFurther Implications to Consider1. Voice & video chat capabilities - A suggestion was made that this application could use voice and video chat instead of typing. This idea had been briefly explored prior to this sug- gestion. However, two major problems were found: a) Observational and participatory re- search in voice and video-based online chat rooms found a plethora of abuse--specifically the overtaking of sexual content, b) Voice and video chat would be very difficult to moder- ate--especially for a live and constant service like this, and c) A large portion of the target
  51. 51. Virtual Town Hall - Design Documentation 51 audience would most likely be less-inclined to use voice and video chat; a key design prin- ciple is familiarity, which includes using discussion methods users are already comfortable with using (i.e. typing). While voice and video chat was disregarded due to these reasons, it may still be a future implication worth incorporating.2. Third-party support - This application lends itself to massive third-party support. As de- scribed in the competitive analysis, a wealth of political and news-based online discussion- based media exists, and the market is growing. Political and news-based media, including broadcast TV, are constantly cut-throat about staying on top of the latest and greatest inter- net integration plans. Politicians themselves are migrating towards social media as well, as demonstrated through the use of virtual conferences and Twitter town hall meetings. So, a link to this application could be the next must-have site feature for these media companies, and the application‟s events could be the next community or campaign feature for politi- cians to use. The online integration possibilities are immense.
  52. 52. Virtual Town Hall - Design Documentation 52 References“Design Principles.” IBM. N.p., n.d. Web. 26 Sept. 2011. < designconcepts/designbasics.html>.Grice, Paul. “Logic and Conversation.” Studies in the Way of Words. Cambridge, MA: Har- vard University Press, 1989. 23-57. Print.Gurbaksh, Chahal. “Elections Will Turn on Which Candidates Use Social Sharing Most Effec- tively.” AdAge Digital. N.p., 4 Nov. 2011. Web. 2 Dec. 2011. < digitalnext/elections-turn-social-sharing-effectively/230816/>.Hampton, Keith, et al. Pew Internet Social networking sites and our lives . Pew Internet, 16 June 2011. Web. 2 Dec. 2011. < social-networks/Summary.aspx>.Howard, Alexander. “In Social Media and Politics, Engagement and Influence Trumps Follower Count .” The Huffington Post. N.p., 3 Nov. 2011. Web. 2 Dec. 2011. <http:// politics_b_1072798.html>.Huang, Mark D, comp. “Design Principles.” Georgia Institute of Technology. N.p., Feb. 1997. Web. 26 Sept. 2011. < design-princ/#deb/>.“Levels of political participation, by use of social networking site platforms.” Chart. Media Bis- tro. N.p., 20 July 2011. Web. 2 Dec. 2011. < social-network-politics_b11672>.“Miami-Dade Mayor Carlos Gimenez holds first virtual town hall meeting Read more: http:// virtual.html#ixzz1fMEetJdW.” The Miami Herald. N.p., 17 July 2011. Web. 2 Dec. 2011. < virtual.html>.Nielsen, Jakob. “Usability 101: Introduction to Userbility.” Use It. N.p., 25 Aug. 2003. Web. 26 Sept. 2011. <>.Norman, Donald A. Emotional Design. New York, NY: Basic Books, 2004. Print.---. “User-Centered Design.” The Design of Everyday Things. New York, NY: Basic Books,2002. 187-217. PDF file.NPD Group. Gamer Segmentation 2011. 2011. N. pag. PDF file.“Obama online: President holds virtual town hall .” MSNBC. N.p., 26 Mar. 2009. Web. 2 Dec. 2011. < online-president-holds-virtual-town-hall/#.Tth0bVaIktV>.Personal interview. Nov. 2011.
  53. 53. Virtual Town Hall - Design Documentation 53Personal interview. Dec. 2011.Saffer, Dan. Designing for Interaction: Creating Innovative Applications and Devices. 2nd ed. Berkeley, CA: New Riders, 2010. PDF file.Sullivan, Cath, Jo Bryce, and Jason Rutter. Understanding Digital Games. Ed. Jason Rutter and Jo Bryce. London, England: SAGE Publications Ltd, 2006. N. pag. Print.Warren, Christina. “Obama‟s Twitter Town Hall By the Numbers [STATS].” Mashable. N.p., 6 July 2011. Web. 2 Dec. 2011. < >.Zichermann, Gabe, and Joselin Linder. Game-based Marketing. Hoboken, NJ: John Wiley & Sons, Inc., 2010. Print.