Social-Media-News Site Recommendation – The Next Web

TNW has a great section on Social Media, where you can find topics in newly rolled out (and probably in beta version) algorithms or features social media sites, emerging usage patterns, as well as pulses of big social media companies.

Also, enjoy their flat-designed website.



Web 2.0: A Potluck Party

I am a foodie, so I see things a little bit differently.

Last week, we read O’reilly’s article on definitions and characteristics of Web 2.0. Let’s briefly recap the 7 core features of Web 2.0 O’reilly listed in this article:

  • Web as a platform
  • Harness collective intelligence
  • Data is the next Intel inside
  • End of software release cycle
  • Lightweight programming
  • Multi-device
  • Rich UX (not necessarily “good” per se)

After reading, I had a strong feeling that definition is so important – I often refer to the Internet as “Web 2.0” with a very vague idea of what it really is and how it is different from its precursor (i.e., Web 1.0). Now, I have a much better understanding and reliable criteria that can help me to judge whether a digital product belongs to Web 2.0. That’s the power of a good definition and principles. At the same time, I also felt the need of a good analog, as it is easier for us to understand and remember relatively abstract ideas. So, as a foodie, I came up with this “potluck” analog for Web 2.0.

Why potluck? Because potluck means that everyone in the party can bring their food to the party, being a food provider and consumer at the same time. You don’t ever need to wait for the big Gatsby party, with a pre-determined party time and food prepared by a famous party host. Potluck party is really a platform for each individual to present their food, which makes the party much flexible, diverse, and light-weight. At the same time, you can tell the trend of cuisines as well as the season in a big potluck party: peaches are served in many dishes? it’s highly possible that the summer is here. Almond flour is frequently used instead of all-purpose flour? Gluten-free must be in vogue. Last but not the least, you got exposed to very rich flavor of different dishes/choices (e.g., Chinese dishes, Mediterranean dishes, and South American dishes at the same time), but no one guarantees good tastes across the big party.

It’s hard to say no to such a comprehensive and fun party. No matter big or small, you usually bring something to the party (could be an appetizer, a main dish, or a dessert). However, it’d better be a good piece of your work: once it is in the party, people will take a look at it and taste it; so be sure to prepare and offer something proper and nice, and don’t get your personal brand as a good cook smeared.

3 Informative Social-Media-Related Blogs/Sites

As I am searching for good sites or blogs about social media, I found that a lot of them are concentrating on marketing area. These marketing-how topics are certainly trendy and handy as social media is becoming the battle for new marketings, especially for small business. However, I felt them too practical and narrowed for us to read in order to gain a bigger picture of social media. Thus, I gathered the following channels (or platforms!) besides Mashable and ReadWrite, hoping them be of help for us to get a better understanding of social media.

The sequence doesn’t imply any ranking intention.

1. Social Media Examiner 

Social Media Examiner is a very big and successful blog writing about marketing on social media – but its not only about marketing. They have good tips on how to better use SNSs such as Youtube, Facebook, and Twitter, in the form of text blog or podcast. As we are really managing our online identity and personal brands, which is somewhat similar to small business (well, tiny business), some of these tips could be good reference for us to utilize our SNS accounts.

2. FastCompany 

Though FastCompany is not a site that dedicated to social media per se, it offers good source of information regarding pulse of companies that relates to social media. As nowadays a plethora of IT companies are involved with social media to some degree, you can always discover useful and real-time information about social-media strategies of those big companies, especially under its Technology section. I often found these posts resonated well with principles we read from the class while added more practical flavor to them. For example, I read a post yesterday analyzing why Facebook and Yahoo! were that interested in Foursquare, which vividly illustrated why “data is the Intel inside” in Web 2.0 age.


3. Soshable

Soshable is actually the kind of blogs that I originally wanted to see when I was seeking for social-media-related blogs. It is a space hosts posts from different bloggers, covering different topics related to social media, including tips for everyday life on SNSs, news on Web 2.0 tycoons such as Google and Twitter, or features of different SNSs. It’s not hard to find useful information for your own targets.

And it has a funny reason to choose such a font in their header section, which almost turned me away from it at the first sight…

Hope you enjoy these resources and share your discovery with me.

An Insightful Video about IxD Big Picture

I came across this great video commissioned by Bassett & Partners, talking about the future connecting world and how interaction design can contribute to it. Many mind-provoking throughts.

My take-aways from it are two points: (1) Embrace “natural” interactions – removing constrains and artificials; (2) Connections among things through sensors and cloud will lead to environment- and context-dependent future interactions. What is yours? Enjoy.

Connecting from Bassett & Partners on Vimeo.

Four Reasons Why I Love airbnb

As a big fan of traveling, I was thrilled to find I am attached to it and visit it frequently even when I am not planning for any trip. It is not only usable but also enjoyable.

This website gives me great experience mainly because of the following 4 reasons:

  • Clean navigation and prominent searching area. As a platform offering choices of accommodations for travelers who have destinations in their mind, searching function should be significant and easy to find. Airbnb does a great job of placing the core function at the very center of the home page, which will also take the central place of on a commonly sized laptop screen. A “search” button colored with bright pink will ensure that you don’t miss the search box embedded in colorful cover photos.   

Screenshot 1:30:13 11:30 AM           In case you are new to the website and just want to wonder around and check it out, the fixed   search bar at the very top of the page will stay what ever page you are going to visit and quickly help you get back to track when you are ready to search for specific destination.

      This simple but thoughtful navigation design can always remind and facilitate users to complete the key task without hassle.

  • Pleasing visual enjoyment. For all online shopping sites, visual attraction is a key to attack and retain visitors. Airbnb is also a form of online shopping sites, where people make purchase decisions without seeing and touching real products. What the difference between airbnb and other online shopping store (e.g., Amazon, Nordstrom, and eBay) is that airbnb is not only selling the product itself, it is also selling the living experience and life styles. These hidden selling points are in no way negligible. Thus, I appreciate the attention and value airbnb has put on the quality of the images and delightful color schemes of the website. I have no doubt that users will be attracted by most of the photos posted and feeling hard to make a decision not because the options are undesirable but because they are all too fancy to just choose one. Furthermore, the whitespace among images is reasonable, rendering great visual effect.
  • Integration of social functions and wish list. This newly-added feature showed a salute to the good idea and experience on Pinterest. I viewed it as a tipping-point that airbnb evolved its focus on exploration rather than just search. Much like a soymilk-maker company in China spent great efforts to advocate and advertise the benefits of drinking soymilk in order to sell its products, airbnb offers contexts and atmosphere of different places around the world to arouse the pleasant yearn for traveling, and indicating living with airbnb is the best way to really immerse oneself in the local culture. I love the wish list function because I can “pin” interior designs that I love, save places for future trips, broadcast on Facebook about my taste, and plan trips with my friend collaboratively. Airbnb introduces the wish list function in the home page, right below the prominent search function. Users can easily browse popular wish lists. What adds to enhance this joyful experience is the great coding – it brings almost infinite scrolling, smoothy and robust. Screenshot 1:30:13 4:48 PM

      In each individual space page, saving to wish list or sharing function (to Twitter and Pinterest) is handy. It is convenient at any stage to bookmark favorite choices. Overall, airbnb enables different pathways for users do discover fun places and ignite their unconscious desires.

  • Trust system and adequate product information. Another formula of successful online shopping site is to build the sense of trust and ease the process of making purchase decisions. Airbnb succeeds in setting up a trust by using traditional user reviews system and approachable profile information of house-renters. Below shows randomly pulled two renter’s profile bar on the property’s page: Screenshot 2:7:13 11:23 AM

      The font used to spell their names is handwriting style, creating a sense of friendliness. Other performance matrices reflect their working style. They helps users to make good matches with the renter they are going to deal with and be aware of what to expect. By clicking the name of the renter, users could check more detailed information and business record of her. All the means very much secured users trust towards the website.

      To help users make informed decisions, useful information is also ready available and easy to navigate through. For example, information regarding a renting property could be viewed in photo’s form, geography form, street-view form, and availability form, using tabs to toggle among. Detailed description, amenity list and house rules (e.g., no smoking, and no pets) are also specified right below the photo gallery. Screenshot 1:30:13 11:03 PM

Above are the major 4 reasons why I have great experience on airbnb. As I browse it, I discover more lovely features that reflect those fine considerations from the website designer. A lesson learned.

Reading Notes: 3 ways of building mobile-optimized websites

Thanks to @mihaela_v, I got a chance to read a comprehensive article about comparison of 3 methods of building mobile-optimized websites. As I am very interested in building mobile-based websites or apps, I would like to take a brief notes about pros and cons of these methods for quick reference.

Method 1: Responsive web design

Same HTML, different page layout.

  • Pros: Same content; A single URL
  • Cons: Content won’t be fully optimized for mobile devices; Slow; Difficult navigation.
  • Examples: Starbucks, World Wildlife Fund, & The Boston Globe

Method 2: Dedicated Mobile Site

Different URLs: desktop website redirect to mobile website. Mobile-version website is basically a separate website from the desktop version.

  • Pros: Easier to make separate changes; Fast; Easy navigation
  • Cons: Multiple URLs; Different content and functionality; Content forking; Redirection required
  • Examples: Walmart, Amazon, & BBC.

Method 3: RESS (responsive web design + server side components)

Two sets of code (HTML and CSS) for different devices, loading depends on server-side programming.

  • Pros: Easy navigation; Less page bloat; Fast
  • Cons: More server resources; Device detection required (which is unreliable)
  • Examples: CNN, eHow, & Wikipedia

Reading Notes on Information Dashboard Design – Part 1

As we are having extensive dashboard design brainstorm meetings going on these days, it is especially beneficial to read this insightful and well-written book written by Stephen Few. I would like to share some take-aways from first 3 chapters that I’ve read.

The first 3 chapters offer more general information regarding information dashboard design with extensive examples, while the rest 5 chapters provide further instructions on solving several important design issues.

The first thing discussed is the clarification of the idea of information dashboard. After examining some existing info dashboard products, he came up with a definition of information dashboard (p. 34):

A dashboard is a visual display of the most important information needed to achieve one or more objectives; consolidated and arranged on a single screen so the information can be monitored at a glance.

Notice how this definition can be decomposed to 4 meaningful elements, each could enlighten us on many design considerations. From the definition, I can see at least the demands on understanding visual perception, and users’ needs.

Bottom line here is: dashboard is NOT a technology but rather a piece of design that aims to communicate, and “the limited real estate of a single screen requires concise communication” (p. 44).

Secondly, Stephen introduced different categorization systems of dashboard. The one most relevant to visual design is the categorization based on the role of the dashboard: strategic role, analytical role, or operational role.

  • Strategic role (e.g., CEO needs the overview of the operation status of the company): high-level measures / no real-time data / no interactions to support further analysis
  • Analytical role (e.g., our DIA2 product): demands greater context / interactions with data / link seamlessly to other means to analyze data
  • Operational role (e.g., monitor machine operation and take action when necessary): dynamic nature, real-time data / grab attention when need immediate operation

Our project clear fits best to “analytical role”, which requires a good mechanism to provide more contexts to the data, and enable comparisons, extensive historical views, & interactions with data to drill down.

Last, in Chapter 3, Stephen gave a list of 13 common mistakes in dashboard design:

  • Exceeding the boundaries of a single screen

NO separate screen or scrolling, which ruins the benefits of monitoring information “at a glance”.

  • Supplying inadequate context for the data

Just as what we discussed in the brainstorm meetings, the budget amount should be offered with   other information, otherwise the number won’t mean anything for the users.

The difficulty here is to show meaningful contexts without introducing distraction.

  • Displaying excessive detail or precision

E.g., displays $98,978,407.78, while it should be $98,978,408 or $99M.

  • Choosing a deficient measure

What to show with what unit? E.g., let users compare the amount or show the percentage change instead?

  • Choosing inappropriate display media

What type of chart or graph to use?

E.g., Stephen is strongly against pie chart: hard to compare 2-dimensional area or angle.

  • Introducing meaningless variety

Always use the display that works best. Users won’t get bored because of this.

  • Using poorly designed display media

E.g., unrecognizable color differences, 3-D bar chart, and distractingly bright color.

  • Encoding quantitative data inaccurately

This introduces mis-interoperation of data.

  • Arranging the data poorly

With a large amount of data to show in a limited space, it is important to place information based on importance and desired viewing sequence. This is why we discussed about what information our persona Matt wants to see first.

Also, design and place information in a way of encouraging comparison.

  • Highlighting important data inefficiently or not at all

Don’t make everything visually prominent, or users won’t know where to look at first.

  • Cluttering the display with useless decorations

E.g., background images, and other distracting ornamentations.

  • Misusing or overusing color

Color should not be used haphazardly.

Also, don’t reply purely on color to convey information: this excludes color blinded users (10% of males and 1% of females).

  • Unattractive visual display

Simple but hard to achieve: don’t make it ugly.