Overview: Twitter has become the most common way for Americans to stay current on what’s happening with our president. PresiTweets is a web app that highlights the conversation around the President’s tweets by allowing users to filter through comments and related tweets to the President and juxtapose those different voices and opinions together to visually build a representation of the conversation.
PROMPT: A fast design implementation for the final project of a graduate level User Interface Design course. Given the constraints of creating a web app using the public access Twitter API and a time frame of a week, we practiced our design process to propose the concept of a possible minimum viable product.
METHODS: User Research, Personas, Scenarios, Lo-Fi Prototyping, Wireframing
TEAM: Perrin Jones, UI Designer | Charis Lam, User Researcher | Brendan Burke, Front-End Developer | Edvard Eriksson, Back-End Developer
BrainstormING: We brainstormed potential users and user needs that we could address with our web app. In a lot of suggestions, we kept coming back to politics and how difficult it is today to stay tuned with all that is happening. That’s when we got the idea to use Trump’s twitter account as the anchor for our app. We then brainstormed user tasks we could complete using Twitter and starting from Trump’s account and that became the basis for our application.
Description of class of users: People who want to stay informed the conversation happening around the President’s latest tweets, but don’t have the time to dig through the comments section to find representative voices. PresiTweets does the filtering so that the users can instantly see and compare different opinions and perspectives related to the President.
Personas: Martin is a retired 54 year old man living in the suburbs of Albany with his wife. He has always had an interest in politics, but has become active and outspoken about politics since retirement. Martin regularly uses social media to share political articles and opinion pieces. Recently, he has begun blogging about his thoughts on current political events so a web app that allows him to easily filter through different categories of responses to the President is very useful for him as he forms his own content. Martin has kept up with the development of technology and social media so he is competent with digital tools, but because he did not grow up with smart technology, he prefers a simple interface that does not require excessive navigation between pages.
Diana is 17 year old high school senior, eager to leave behind her rough high school years. Diana did not grow up in a politically-inclined environment so she’s only mildly interested in politics and only has general knowledge of recent happenings. However, Diana, a millennial, did grow up surrounded by social media. After the recent elections, her feeds have all become saturated with political events, making her curious about recent political happenings-- especially the controversy around the President’s tweets. For a novice, just beginning to form a political opinion, a web app that allows her to filter through, organize and save pieces of the conversation happening around the President very useful.
Iterative concept sketching: Once we settled on our current focus, we listed all the functionality of our app and did pencil sketches to quickly visualize our ideas. Our main focus here was coming up with interface solutions that would make it efficient and quick for the user to interact with the app. This was when we came up with the idea of using + and - buttons to move content across the interface and a circular menu to navigate the categories of results.
Lo-fi prototyping: After concept sketching, we selected and cleaned up the ideas we liked into a rough wireframe with more pencil and paper.
Hi-fi prototyping: With the relatively solid lo-fi wireframe, we built a digital mockup to think through functionality and more specific visual elements like color palette and button icons.