[liberationtech] ThinkUp
Yosem Companys
companys at stanford.edu
Sun Nov 20 16:24:18 PST 2011
Interesting startup by Anil Dash and former Kickstarter CTO Andy Baio...
Yosem
<http://profile.typepad.com/trapani>Designing ThinkUp 2.0
Over the past year, through 8 alpha and 15 beta releases,
ThinkUp<http://thinkupapp.com/> has
evolved into a rich platform that captures and analyzes data from Twitter,
Facebook, and Google+. All this time, the developer community has been more
focused on ThinkUp's internal engine than its user-facing look and feel.
ThinkUp's current design, generously created by Bill F. at
Dash30<http://dash30.com/?page_id=152> in
his free time, came together in a piecemeal fashion, bit by bit, as new
functionality emerged.
So far, we haven't taken a comprehensive, user-focused approach to
designing ThinkUp's application interface and design. That's about to
change.
For the past 7 months, Expert Labs has been working closely with Mule
Design<http://muledesign.com/> to
define what our target users want and need, and how the application can
serve those needs, clearly and in the spirit of ThinkUp's community and
mission. We're so pleased with the ThinkUp 2.0 look and feel Mule Design
has created, and we're thrilled to finally pull back the curtains and
unveil their work.
Today, Mule Design's Erika Hall explains ThinkUp 2.0's design, and the
research and thinking behind it. Read on to get the details and catch a
sneak preview of what to expect in ThinkUp 2.0.
------------------------------
Now that we have been working with the (terrific) ThinkUp team at Expert
Labs for a little while, together, we have arrived at a design that meets
key goals and forms a strong basis for future development.
We want to share this design with the wider community to make sure that we
haven’t missed anything essential to ThinkUp.
The Background
At the beginning of the project we conducted initial research and
established key goals for the application design. These goals guided all of
the subsequent design work.
The goals
- Encourage strategic use of data from social media.
- Create a look and feel that is warm, welcoming, and supportive of the
strategic goals of Expert Labs.
- Accommodate users from a variety of organizations and technical
backgrounds.
- Structure application interactions around user need and core
application capabilities.
- Simplify workflow and messaging.
- Create guidelines for making design choices that the open source
community can use as the application develops.
What we heard from current and potential users
During our research we conducted 7 interviews. We grouped these interviews
into 4 user types: 2 Small Businesses, 2 Content- & Community-Focused
Organizations, 2 Government Agencies, and 1 Personality Type User. Of these
7 interviews, 5 were current ThinkUp users and 2 were potential users.
- Current users know what they would like to do with the application but
not how to accomplish the goal.
- Users know the difference between communication/content creation and
analysis but will focus less on analysis if the way to do that is less
clear.
- Lack of prioritization means users stick to what they already
understand
- Users have high expectations for accuracy. The complexity and
inconsistency of messaging reduces trustworthiness.
- Users had some trouble with language choices that were misleading or
“put them off” the application a bit.
In order to meet these goals for the application design, we worked in close
collaboration with the Expert Labs team to create a simple, extensible
interface framework visual design system that would lend itself to
continued application development.
The overall structure
In order to accommodate continued growth and development of ThinkUp, a key
goal of the redesign was to create a solid, intuitive structure.
Dashboard
The dashboard aggregates all of the key insights across social networks.
The other areas of the application are divided among the basic questions
that ThinkUp should answer:
Activity: What has [profile] published or interacted with in social media?
Response: What is the social media reaction to [profile]?
Connections: Who is responding or interacting to [profile]?
Conversations: What discussions are taking place?
Links and Media: What media or topics are appearing in the activity?
Each of these acts as a filter and a lens on the social media activity
coming through the application, allowing the user to focus on a given
aspect of all activity to answer the most relevant questions at the moment.
Within each of these areas, there is typically an insight stream, labeled
Updates, which is an opportunity for ThinkUp to report back any
observations of note, insights pulled from the data, relevant to that area
of the application.
Any data relevant to that section can be graphed.
And following that is the activity stream for the section filterable by
service or activity type.
Also, Saved Searches offers the opportunity to save reports.
The Look and Feel
We designed the application in warm greys in order to be easy on the eyes
during frequent use and allow the information to come forward. The
interface itself is lightweight while retaining a sense of dimensionality
for a little bit of visual sophistication. We intend the navigational
elements to very clearly orient the user in the application without
dominating the experience.
The pages posted here to exemplify the design system are:
Dashboard
[image: Tu_1_dashboard]<http://anil.typepad.com/.a/6a00d8345409f069e2015391fa7d55970b-popup>
Activity
[image: Tu_3_activity]<http://anil.typepad.com/.a/6a00d8345409f069e2015391fa7e71970b-popup>
Conversation
[image: Tu_5a_conversation]<http://anil.typepad.com/.a/6a00d8345409f069e2014e8bee685a970d-popup>
Connections
[image: Tu_4_connection_2]<http://anil.typepad.com/.a/6a00d8345409f069e2015435cec804970c-popup>
Account Info
[image: Tu_2a_accountinfo]<http://anil.typepad.com/.a/6a00d8345409f069e2014e8bee6589970d-popup>
The Interface Elements
Here's some of the thinking behind each of the interface elements.
Header
We kept the header very light and focused on information about the profile
the current user is working with. If there are multiple profiles, the user
can switch among them.
Secondary Navigation
Within an individual profile, the next most important element to the
framework is the secondary navigation down the left side. If there is new
activity in that area, the green indicator "lights up" to encourage the
user to explore the different views of the information.
Messages
On the dashboard you will see the message styles for system
messages/alerts, tips, and new activity.
Profile Pics
Within ThinkUp we have begun to create a visual language for different
relationships, so the user can tell at a glance the significance of another
user. Arrows signify whether it is a one-way, or mutual relationship and a
border indicates that the user has exceeded a threshold of "importance".We
kept this visual language very light so that the user pic remains the
dominant visual element.
Updates
This is a stream of any trends, milestones, or significant changes ThinkUp
has noted along with a visual indicator of whether this is positive or
negative for the profile.
Summary of Activity
For cases in which it is possible to visualize activity trends, we have
provided a visual language for graphs. We anticipate this will be a rich
area of further application enhancement.
Activity Stream
For cases such as [Profile] Activity and Reponses (From others on social
media platforms, this activity can be viewed in a continuous stream and
filtered by service or other criteria.)
All of the modular elements that appear in the primary content well are
designed to be collapsible to the header to help the user focus on the
desired set of insights.
We also included the design for the Account Settings page to illustrate
what any form in the application would look like.
NOW: Looking at this model we developed working with Gina, Andy, and Anil,
let us know if we can clarify anything or answer any questions in order to
help you, the community, extend the system and further develop the model to
help ThinkUp be the best, most useful and pleasant way to capture content
and get insights from your social media activity.
------------------------------
Send your questions and feedback about Mule Design's work to the ThinkUp
project mailing list <http://groups.google.com/group/thinkupapp>, or post
here in the comments. We're excited to hear what you think.
Posted by Gina Trapani on 09/30/2011 |
Permalink<http://expertlabs.org/2011/09/designing-thinkup-20.html>
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://mailman.stanford.edu/pipermail/liberationtech/attachments/20111120/4399b21a/attachment.html>
More information about the liberationtech
mailing list