Reflect Media Browsing

Media Full / Detail View

Contacts Page

The Archivist

Project Details:
Seeing a need to track user-sentiment, marketing campaigns, and general social memes, The Archivist was born. Invented by me and Karsten Janusewski after many discussions with marketing teams, social-scientists, and social-networking “gurus,” we realized there was a lack of tooling to be able to collect, aggregate, and analyze tweets around subjects important to companies, historians, and others interested in the ephemerial and ever-changing Tweetsphere.

We started with a small-scoped installable application, but once we realized the potential scale, user-interactions, and experience, we developed a second version, this time web-based.

The Archivist Homepage

There are plenty of easy and inexpensive ways to gather information on how users are actually using your software or site.

Check out “User Testing On The Cheap when you have time.

Audience Research

Once we decided to take on the project, we turned to our already established group of experts for guidance. Because we already had a prototype of a similar application in The Archivist Desktop, we already had a ready cadre of fellow-Microsoft employees, friends and colleagues in other companies, and current users whom we could tap for solid user-testing which would provide invaluable guidance on the import of certain features over others, and the direction the project needed to head. While this might skew the results of the user-testing, we felt with the tight-timelines and minimal budget, talking to current users and technologists with which we already had relationships was the way to go. We focused on two primary groups of users, our internal Microsoft team and users of The Archivist Desktop.

Project stakeholders and internal Microsoft team-members

It was imperative that before building The Archivist Web, we fully discussed the project and its intricacies with internal team-members and stakeholders to ensure that their goals were being met. Simply setting up short individual meetings with people was an easy way to gather feedback on how they used The Archivist Desktop,and what new features they might be looking for in The Archivist Web. Additionally,by communicating clearly with team-members, we were able to make good contacts with other parts of the company and leverage existing technologies and take advantage of a great knowledge-base that we might not otherwise have access to. For instance, by ensuring that we discussed our plans with the Windows Azure team, we were able to overcome some serious hurdles with the way we were planning our methodology for data-storage. Without help from this team, we might have been derailed at the beginning.

“Conversation” with current users

Again, because we had already released The Archivist Desktop, we had an already-established user-base. Over the years there had been a few “vocal” users – who either wrote in to thank us, or report problems and failures – who we felt could provide valuable feedback from real-world use-cases. At the beginning stages of building The Archivist Web we simply emailed a few of the users with whom we had been in contact and asked them a simple set of questions surrounding specific topics such as types of visualizations they would use, how often the tool needed to update, the way they were using the data and the like. By asking specific questions rather than asking for general feedback, users were able to focus on key issues and needs that we could act upon. Often, by asking a generalized question such as “What would you like to change,” you get very generalized answers that are hard to turn into actionable tasks.

Personas are a representation of real users, including their habits, goals and motivation.

User personas

From our sit-downs and email conversations, we were able to group our potential audience into three general categories. By segmenting our audience into “personas” we were able to focus our efforts around specific scenarios and the needs of these specific characters. In meeting the needs of these three groups, it was our hope that we would not become myopic on satisfying one group at the expense of another, or, contrarily, find ourselves trying to please everyone who might possibly use the service. Our goal was to sate the needs of the majority of our audience and provide our core users with the best experience possible. To this end, we arrived at three core personas.

I’ll note here for a second that there’s a lot of ways designers approach User-Personas. Some user/human-centered designers can spend a long time fleshing out the behaviors and market-segmentation of your target audience. We took a pretty rudimentary approach. Smashing Magazine defines it well. In fact, this whole article really is pretty awesome and worth a read in-general.

The Drive-By

We know that most users will come by the site once, do a quick search, check out some visualizations, and then leave. That’s just the nature of building websites, especially one that is specifically targeted to such a specific niche as The Archivist. To the casual user we wanted to provide an engaging experience with the fewest barriers to entry.

However, we also knew that we had to concentrate quite clearly on the potential return-users – the people that would keep coming back and really taking advantage of the great features of the product. It is to these particular users that we thought we could provide the most value.

The Marketing Manager

“Social” has become an integral part of any brand-strategy, and until now, there had been only a few ways to gain access to specifically-targeted Twitter data. As well, that data generally has been presented in the most raw format from which the Marketing Manager would have to extrapolate the data. The Archivist needed to be designed to provide a high-level method to extrapolate meaningful data from the thousands of tweets that would now easily be kept in an archive. Additionally, all of this would have to be easily shareable with colleagues, clients, or friends.

Tracking the general “sentiment” is of great importance to the Marketing Manager, too. In addition to seeing who is tweeting, and how often people are tweeting in general Marketing Managers expressed interest in quickly being able identify “how people are feeling” about a brand or site over time.

The Academic

Because we had the previous experience with The Archivist Desktop, we knew that there was a surprisingly large demand for this tool in the world of academia. During the last year or so we’ve had the opportunity to communicate with numerous professors and students who have found The Archivist Desktop useful for their research. One subject that I believe helped foster interest in The Archivist was the Iranian Elections of 2009. At that time many news outlets were discussing the way Twitter was being used to communicate support for fair elections and the unrest during the controversy over the election results. Students and professors at this time started using The Archivist to do custom searches and build archives of over 200,000 tweets for data-analysis.

For this user, we had to consider how accurate the data were that we are providing and making it easy to access that raw data. For the academic user, the accuracy of the data was generally more important than for a Marketing Manager looking to spot general trends and sentiment.

Wireframes

I thought it might be useful to provide the full PowerPoint walk-through of the wireframe set. This was produced to help give the team an understanding of the full user-experience of coming to to the site under different circumstances and conditions. One thing you may note is the exploration of an extensive array of filters. Unfortunately, this feature of all others is one I personally really wish we were able to fit into the scope of this release.

Visual Design

The Visualizations: Visual Explorations

What we could do

The Archivist User Dashboard

• Tweets over time
• Top Users
• Top Words
• Top URLs
• Tweet vs. Retweet
• Top Sources (software)

What we couldn’t do (Feature Scoping)

Filters & Geolocation

As I noted earlier, I spent a bit of time thinking about the frequent requests for filtering by date, secondary keywords, and other items. Quite simply, with the way Twitter works, some of this data wasn’t consistently available, like Geo-location, and others were just so gnarly we couldn’t scope them into this release.

Conclusion

As you can see, there considerable thought from the outset on the project goals, to whom we were speaking, and exploring potential ways to develop a robust product that would break new ground and be useful. Of course, once compared against our timelines, budget, and resources the project had to be scoped — and significantly scoped.

And, of course, making compromises on what you *know* are good ideas is sometimes painful. Weighed against either getting features half-baked or the project missing immovable goals, however, decisions become much more easy to justify and better for the project as a whole. For instance, by making the solid decision on the outset that one of the “project principles” was to open-source the project, decisions such as removing the update-on-demand feature was not only justified due to cost-restraints, but we had provided a way for users who *absolutely had* to have the feature a way to get it with investment of resources on their end. As well, since the project was released as a free service, it was much more easy to ask users to put some personal investment into a feature that would cost hundreds of thousands of dollars in additional storage, bandwidth, and maintenance.

In all, The Archivist has been a great success and a project of which I’m very proud.

Related Social-Based Projects

• MIX and PDC Live Streaming Video Players
• Flotzam
• The Archivist in Academia
• Take Social Back: A call to action

Press

• Twitter: The Great Information Pyramid Scheme
• 11 Twitter & Social Media Tools To Try In 2011
• Instant overview of the excellent #foc10 ‘Future of Crowdsourcing’ global event held in #Sydney today

Project Details:
On September 15, 2010, Microsoft held an event in San Francisco to announce the release of Microsoft Internet Explorer 9 Beta. For this event, I engaged three agencies to develop websites that pushed the limits of HTML5 and would take advantage of Internet Explorer 9′s capabilities. For the event, we wanted to wow the press with “The Beauty of the Web.” To this end, one of the companies with which I developed a site was La Surprise.

Floweroscope

La Suprise is a small agency based in Paris, and, like I said about STEAW, fantastic to work with. Their team designed and developed a fully HTML5-based website that takes advantage of SVG and JavaScript, as well as HTML5 audio and other features. It’s a simple site that simply draws kaleidoscopes using a library of 150 unique images. While the idea for the kaleidoscope isn’t so new, our goal to display some specific features of HTML5 was exceeded by this small project, done on a short timeline. Check it out at http://www.floweroscope.com

UPDATE: This site has been retired by the owners, La Suprise.

Floweroscope

Family Wall

Floweroscope

Floweroscope on Beautyoftheweb.com

FWA Site of the Day: October 19,2010

Life is a flower

A mind-boggling kaleidoscope experience that showcases Internet Explorer 9′s ability to create amazing randomised symmetrical effects and shapes without the need for plugins. Draw your colourful creation to the backing of the oh-so-slightly creepy fairground music. So mad it has to be good.

FlowerOscope, created by the Parisian advertising agency La Surprise, is an absolutely beautiful and enchanting emulation of the classic kaleidoscope toy.

- PC World

]]> http://thunderkick.us/blog/2011/07/26/floweroscope/feed 0 http://thunderkick.us/blog/2011/05/18/html5-css3-workshop-svc http://thunderkick.us/blog/2011/05/18/html5-css3-workshop-svc#comments Wed, 18 May 2011 21:33:56 +0000 systim http://thunderkick.us/blog/?p=2337 When designing online experiences for clients, internal teams, or even yourself, it’s always been important to use technologies that are not only appropriate for today, but are future-proofed to ensure their longevity way past the time you walk away from the project. HTML5, coupled with CSS3 and JavaScript, is the way to markup your sites to help ensure current, modern browsers can take advantage of the most up-to-date technologies and methods, as well as make your life easier when designing and developing User Experiences.

As HTML5 is in its nascent stage — and not fully agreed upon by the competing browsers — finding solid instruction is at times difficult. There are many books available, but many require instruction — a person to help guide through and seperate the important, useful stuff from what may be (over)hyped.

As defined by P.C. Magazine,

(HTML Version 5) The next-generation of HTML from the Web Hypertext Application Technology Working Group (WHATWG). HTML5 is designed to provide a comprehensive application development platform for Web pages that eliminates the need to install third-party browser plug-ins such as Java and Flash. HTML5 provides support for 2D graphics (see canvas element), document editing, drag and drop, browser history management, video playback and local file storage.

What this means is many of the hurdles we once faced when building our Experiences are now an integral part of HTML5 (and CSS3). This not only helps our users and customers delight in the best-possible experience, but helps those of us more easily (and better) create those projects, products, environments, or what-have-you.

With all of this technology, user-centered design capabilities, and blue-sky possibilities at our doorstep, designers and developers are seeing new opportunities to create immersive, incredible experiences. However, books and websites are the only really accessible media for learning. So, what’s a Seattle-based designer/developer to do when wanting hands-on instruction from an “industry expert,” while not able to attend the rare-but-worthwile conferences that come to town? Well, attend one of the workshops/bootcamps I’ve been hosting at Seattle’s School of Visual Concepts.

SVC is an incredible alternative school for those of all levels, professions, and interests to learn more about the Creative Arts, both digital and print. Since October 2011, I’ve been hosting / teaching an HTML5 (+ CSS3 & JavaScript) workshop at SVC with great results and response.

]]> http://thunderkick.us/blog/2011/05/18/html5-css3-workshop-svc/feed 0