Data-Driven Design and UX: Mutually Exclusive?

giphy

Data-driven design sounds pretty self-explanatory on the surface: collecting data about activities  of users on a website and making key design decisions based on the insights garnered from these numbers. Using this data from web analytics to make design decisions can be a cheaper, automated, and potentially quicker way to know what users want. Or is it?

We, as students and professionals of the UX/IA profession, already know that many businesses have no idea that UX research and design is a discipline, and if they do know it exists, might not necessarily know how it works. Even if a business or company knows about UX design, they might have the hubris to think they can straight up design or engineer their way directly to a great user experience. This is where analytics and data-driven design can be seen as a workaround to the iterative UX design process. Why hire a team of people to do qualitative research on our users when we can cheaply collect quantitative data. Quantity is better than quality in the world of big data, right?

Lets take a step back and explore web analytics. Web analytics is the measurement, collection, analysis and reporting of web data for purposes of understanding and optimizing web usage. This means collecting concrete numbers on metrics like page views, bounce rates, click throughs, etc. These numbers could be useful in discovering usability problem areas on your site. Users never click through on a certain page, so something must be wrong. Lets fix the problem! Now the decision on HOW to fix the problem is the difference in depending purely on analytics versus using these numbers as a tool to begin the the UX design process in a certain area of the site.

799892681_8afde389cb_o

By utilizing purely analytics, a company can adopt the model of South Park’s underpants gnomes to their design decisions (apologies if the reference is a little dated). As a quick reminder, the gnomes of South Park would collect underpants in Phase 1, ????? as Phase 2, then profit is Phase 3! By only working with quantitative numbers, a company is basically following these three phases: 1 is collecting data, 2 is ?????, 3 is great user experience and growth! From my personal experience working with a company that adopts this model, I can say that this mysterious phase 2 is founded in “intuition”, “gut feeling”, and “industry knowledge”, which truly is….???

But luckily we as UX/IA students and professionals know that this approach is flawed and completely leaves out one of the most important aspect of the UX research and design process: context. There are many resources available on the web that explain how to incorporate data-driven design into the UX design process, some of which I link below. Basically, these quantitative numbers offer a great starting point to designing for a better experience. Resources, especially time, are not infinite, and having quantitative numbers can be a good way to know where to divert attention.

Pamela Pavliscak (2015) Six Myths about Data-Driven Design

Rameet Chawla (2015) Creativity Must Guide the Data-Driven Design Process

Bartosz Mozyrko (2015) Putting Big Data in Context

Jennifer Cardello (2013) Three Uses for Analytics in User-Experience Practice

Design Critique: Spotify Connect (Iphone/OS X Yosemite)

06618844-photo-logo-spotify-connect

(source www.clubic.com)

 

Introduction to Spotify Connect

Spotify Connect is a feature that is described by Spotify that allows the user to “Play Spotify through your speakers, laptop or TV, using the Spotify app as a remote.” Specifically, I am examining the ability to use the Spotify Iphone app as a remote to control the Spotify application on a Macbook Air running OS X Yosemite. (https://www.spotify.com/us/connect/)

Design Problems
If a user is listening to Spotify on their Iphone and has Spotify open on their Macbook, there is alarming visual feedback on the Macbook Spotify interface that suggests the potentially embarrassing music that is playing privately through the Iphone headphones is blasting through the computer speakers.

Screen Shot 2015-09-09 at 11.57.03 AM

The feedback provided through the laptop interface falsely suggests that the user has suffered a mode error and is operating the application through the wrong mode, in this case Spotify Connect. However, this feedback is not true and the music is still only playing through the Iphone headphones, which leads to confusion.
To be fair, Spotify Connect on the Iphone app does adhere pretty well to Norman’s principles of visibility, constraints, and feedback. There is a visible Spotify Connect button on the bottom of the interface that lets the user know they have to press there to specifically activate the function, in essence constraining the task of activating Spotify Connect to that one area of the screen. Pressing the button provides immediate feedback in the form of a Spotify Connect status screen, letting the user know where their Spotify music is currently playing.

IMG_6317IMG_6318

 

 

 

 

 

 

 

 

 

 

The main design flaw can be attributed to poor mapping. The user’s mental model is simple: Spotify plays music on whatever device they are controlling. Confusion arises when your actions on an Iphone unexpectedly affects what happens on your Macbook. There is a gulf between the execution and evaluation, and the design has failed. A related design flaw is the choice to automate the Spotify Connect function which takes away control from the user, which contributes the gulf of the original goal of playing music on your Iphone, and the evaluation of seeing unexpected feedback on the Macbook interface.

Examining the visual feedback of the Macbook interface also elucidates a design flaw, and ultimately leads a user to think they have erred. This can again be attributed to poor mapping. The button that lights up to let a user know that music is playing on the Iphone is the same button as volume. Not only that, the volume bar which normally provides feedback on how loud your music is playing through your Macbook is maxed out. A user’s mental model would have them believe that music is blasting from their computer speakers.  There are ultimately more functions than specific controls on the Macbook interface, which in this case leaves the user confused.  

spotify close-up

Recommendations

The easiest design recommendation is to give control back to the user. The Iphone app should ONLY connect to the MacBook app if the Spotify Connect function is activated by the user on their Iphone. The design recommendation for the Macbook visual feedback is to simply add another button next to volume on the interface that only provides feedback to the status of Spotify Connect. The bright green bar with text  that originally pointed to the volume, would now point to the status of Spotify Connect, and let users know the source of the device that is playing through the interface.

 

 

 

 

What about GitHub?

via github.com

via github.com

Repo? Forking? Pushing? Pull request? Merged?

We’ve all heard about Github, but unless you are a programmer, you probably don’t understand exactly what it is nor how it works. In simple terms, Github is a code sharing and publishing service that allows versioning, collaboration, access control, task management, wikis, bug reporting, and feature requests. The code is hosted in a repository, or repo, and gives anyone with access to your repository to copy the source code (forking) to their computer, make changes, put those changes back to the repository for review (pushing), have the owner of the repository look over the changes (pull request), and if the owner agrees, the changes will be made to the master source code (merged). This process allows for multiple programmers to contribute to a single project without duplicating or overriding anyone else, and having snapshots of every version of your project.

Screen Shot 2015-04-20 at 1.54.45 PMIf you want to know more about the specifics of how Github works, or the Git, the open-source command line tool powers Github, I would check out these following resources:

GitHub For Beginners: Don’t Get Scared, Get Started

HTG Explains: What Is GitHub and What Do Geeks Use It For?

What Exactly Is GitHub Anyway?

What is Git used for? What does it do exactly?

Why should we know about it?

Admit it. We’ve all had to deal with them at one point or another: IT, developers, engineers, programmers. Traditionally, the relationship between developers and designers has been contentious to say the least, and has be described as “[bordering] on sibling rivalry”.

Catch_cats_3

However, there are ways to make this relationship better and more productive. This article from Smashing Magazine argues that you should include your developer in the design process. After all, one wouldn’t want to propose a design that is impossible to build, and developers actually make design decisions all the time.

If communication is the key to success, then we must learn the communication of those implementing our research-informed designs. Github is incredibly popular with developers and programmers. According to Github, there are 9.2M people collaborating right now across 21.8M repositories on GitHub. Chances are that sometime in your life as an information/UX professional, the developers creating your user research informed design will be working with Github. The major benefit of learning the basics of Github is the ability report bugs and make feature requests. Instead of email, gchat, skype, slack, or any other communication channel one prefers, nothing is more efficient than using Github to request changes and report problems. By posting issues directly into a Github repository, all the problems become centralized, leading to quicker fixes and faster changes to the iterative process of messy design.

Experience Design for Art Fairs

The beginning of March signals many things to different people: the welcome arrival of spring, NCAA March Madness, and the beginning of the MLB season. But for those who are participants and spectactors of the art world, March announces the beginning of international art fair season. According to Art Forum’s calendar listing for art fairs, there are 16 art fairs happening worldwide just in the month of March. Nine of those art fairs are occuring right here in Manhattan, which is an exciting prospect to any resident of the city with any interest in art.

For those unfamiliar with of what exactly is an art fair, they can be imagined as a glorified “shopping experience, but one elevated…to the level of fine art”. I would compare them to a trade show, where galleries rent out booth space to show off their best work for sale. Collectors use these events to get a distilled and filtered few of what the newest and hottest artworks are available to buy. The fairs are also open to the general public as an opportunity to see a lot of art condensed in one large area. To get a better understanding of the art fair phenomenon, I would recommend reading Hyperallergic’s aptly named article WTF is…an Art Fair?

The Armory Show 2014 (via Forbes)

To get an idea of exactly how large and popular these fairs can be, all you need to do is look at the numbers of the 2014 Armory Show. Last year, The Armory had 65,000 visitors in 5 days, over 200 selected galleries from 29 countries(via The Armory Show) Those numbers represent an interesting problem with the EXPERIENCE of attending one of these events. It is crowded. The space is a labyrinth. The only guide is a list of participating galleries and maybe a map of booths. This is a recipe for information overload and a frustrating experience of not knowing where to begin or even what’s worth seeing based on your personal interests.

I am currently the research intern at Artsy’s The Art Genome Project, and was recently able to listen to the Head of Design at Artsy, Robert Lenne, speak about Artsy’s innovative approach at changing the traditional art fair experience.  As an initial foray into the world of art fairs, Artsy developed a platform for fairs to have all participating galleries upload their works for sale before the fair opens, allowing any person with an internet connection the ability to preview the entire show. This was a particularly useful tool for a potential visitor to develop a game plan to make the best use of their time when they check out the fair. For those curious of these previews, you can check them out at Artsy Fairs.

However, to really change the experience once a visitor is at the fair, Artsy developed a product that anyone with a smartphone can easily utilize to make the physical experience easier to digest, interactive, and fun. The product comes in two parts: a smartphone app and what Artsy calls “columns”. The smartphone app includes a map and a portable version of the preview tool, allowing a user to see all the artworks, artists, and galleries in the palm of their hands. The “columns” are large totemic objects consisting of two 65 inch tv screens mounted vertically and placed at strategic locations throughout the fair. The columns display a map of the fair to let users with or without the smartphone app more easily navigate the space. The exciting part is what happens when both of these tools are combined. Users of the app are able to favorite galleries, artists, and artworks that are at the fair, and this data is displayed live on the columns. Trending artists, artworks, and galleries appear on the columns as a unique, never before seen piece of information for visitors of the fair to interact with and digest. Check out a video produced by Artsy showing off the columns at last year’s The Armory Show: Artsy Columns at The Armory Show 2014