Starbucks vs. Dunkin' Donuts

• 

• The Architect

  Starbucks and Dunkin' Donuts’ approaches to creating meaningful community around their brands and extending their companies beyond a typical retail website is as different as their stores. Both websites have menus, nutrition information, online stores, store locators and social links -- the bare necessities for brands of this nature. The similarities end there. Dunkin' Donuts' version of extending itself beyond the walls of its stores is reminiscent of old gimmicks and half-hearted community-building ploys. There's a healthy version of its menu, links to a running site, some promos and a contest, and then we’re done. Dunkin' Donuts provides no opportunity for its fans to be a part of its website in any meaningful way. Starbucks has done better in their attempts. Noteworthy is the idea of improving the company with your ideas -- something that speaks to core fans. If you love the green Starbucks splash stick, then you should know it was developed in this way. The website allows visitors to share ideas, vote on ideas submitted by others and see which ideas have received the strongest response. It promotes community by encouraging visitors to play a part in improving the brand they love through their own opinions and innovations. Second to this, there’s a blog that’s halfway worth subscribing to if you’re an ultra fan. And while it is not exactly groundbreaking, it has a genuine appeal and seems to keep a decent personal touch to it with little of the usual corporate interference on the surface. Introducing new conveniences, products and free offers allows the blog to be something worth subscribing to for core users and brand evangelists. In addition, Starbucks offers a place for those willing to contribute to their causes. It’s not terribly engaging, but having a directory of people bound to stores and allowing for conversation within each store is a worthwhile effort. It needs more work in order to truly establish the store as a gateway to the local community.

• 

• The Craftsman

  A website should not only be an extension of a retail store, but it should also be the gathering place for your brand's community of followers. It's important to give that community a great experience when they visit your site, and design plays an integral role in that experience. Dunkin' Donuts and Starbucks handle this experience in very different ways, and both leave much to be desired. Let's start with Dunkin' Donuts. It is quite clear that the goal of this site is to push products. The first thing that I notice is the horrible Photoshop work on the home page. It's a collage of poorly photographed and cut out cups, beans and other products. It's obvious that none of the elements ever appeared together naturally. With coffee beans the size of walnuts and cups the size of buckets, the scale is so ridiculous that the whole thing comes off as cheesy and poorly produced. There is a lot of movement and visual stimulation on the home page, including pop-up menus, enlarging images and a hot pink drop-down menu. It seems that at any moment a man wanting to guess my weight or swallow a sword could jump out from behind that burlap sack. These elements are over the top and a detriment to the functionality, as the page takes several seconds to load. The navigation is passable, but there is a lot going on. First you have the main navigation with drop-down menus. Above that you have a secondary navigation that is one of the smallest I have ever seen at only six pixels. I would think that a store finder and franchising information warrants a larger size. And above in the upper right corner there are 4 graphics that appear to be buttons but do nothing when clicked or hovered over, creating confusion. Secondary pages on the site are cleaner, but there are still some alignment and spacing problems, and an overall lack of design consistency makes the site look thrown together. While some pages look pretty good, others look quite bad. On any given page there are several fonts and many colors, causing it to look very busy. Starbucks' website is in stark contrast to the Dunkin' Donuts site. It's clean and minimalist in a way that feels great on the home page, but once you dig into the site, the pages become bland and boring. The home page immediately gives you hierarchy with a large, interactive feature that is simple to navigate. Below that are three areas that funnel traffic with a minimal navigation system. The light background helps the warm, rich imagery pop, creating terrific contrast. Nothing is in your face or obtrusive. It's subtle and functional -- just what you'd expect from a brand like Starbucks. The secondary pages aren't nearly as strong as the home page. The primary and secondary navigation are minimal to the point of being boring. The leading on the navigation and body text is tight and should be expanded. The subtle drop shadow on the top of the canvas area makes that area appear as a frame and does nothing to enhance the page. Columns are narrow, and content feels cramped. There is wasted real estate under a poorly designed search bar which features a "go" button -- none of which feels like what you would expect from Starbucks. There is also a lot of inconsistency from page to page, especially in the way their products and offerings are displayed, which makes the browsing experience feel disjointed. Both sites have work to be done and leave me feeling disappointed. I expect better from these two captains of the coffee industry. While Dunkin' Donuts is over the top with its bright colors and flashy animation, Starbucks doesn't go far enough with its neutral colors and boring framework. Like a cup of coffee that's too strong or too weak, these sites need to find the perfect brew.

• 

• The Developer

  Anyone who has studied the metrics on their own website knows that getting people past the front page is a big deal, getting them to stay longer is even a bigger deal, and having someone feel that your site is worthwhile enough to come back is the ultimate score. Today's websites are as much about visitors consuming information, collaborating and interacting as a community as they are about selling a product or service.Interestingly, when comparing Dunkin' Donuts to Starbucks, it is clear that both companies have attempted to make their sites into something more than just a reproduction of their retail storefronts. They both have used various methods to try to capitalize on the enthusiasm of their customers. Dunkin' Donuts offers a feature that allows you to create your own donut, while Starbucks has launched a number of social websites that range from promoting specific product lines to advocating social change to soliciting suggestions to make your Starbucks better. Overall, Starbucks does a better job of providing compelling reasons to visit the site. However, both make the perplexing mistake of burying the content rather than bringing it to the forefront. Dunkin' buries these nuggets in favor of button graphics and forces visitors to hunt to find something interesting. Starbucks hides a single text link for each of their social sites below their Flash movie that gets in the way of finding something more useful. Both companies have very active Facebook pages with posts happening every few minutes -- not that you would know this by looking at the front page of their site. What's that you say? The goal is to sell product? Well, I have a question in return: Isn't it necessary to drive traffic to your site in order to sell products online? If there are 4.5 million fans on Starbucks' Facebook page posting every couple of minutes, you do the math. I'll just hold off on returning to these websites until either company gives me a reason to.

10 One-of-a-Kind E-commerce Websites That Put Ordinary Sites to Shame

This collection of creative e-commerce websites includes those that take a unique approach to creating a storefront, and each are discussed in light of what makes their creative designs work so well.

Hopefully, you too can find some inspiration in the collection below to help you in your own e-commerce website designs. Which of these made a big impression on you?

Mom and Popcorn

This vintage website is a very unique experience in that it jumps off the page and makes you forget what decade you are really in. Although not the typical clean cut design of most popular e-commerce sites, it remains easy to use and bursts with creativity. It is very easy to find what you are looking for and the prices are prominent. You don't have to click around aimlessly to figure out what to do next. Five stars for Mom & Popcorn!

The Affair

The Affair is a UK based, offbeat clothing company that makes no apologies; neither for its darkness and morbid atmosphere, nor for its unique shopping design. Although simple and uncluttered, it is anything but standard. For one thing it has a discreet but impossible to miss shopping cart link in the corner. When an item is added to the cart, there is an animation of the selected item dropping into the shopping cart. This is a great touch because so often people click several times to be sure their selection was made and end up with too much in the cart at the end. With The Affair's unique concept, there is no confusion. Another useful feature is that each product's thumbnail offers a 360 degree view so you can examine it from all angles. It's these details that make all the difference.

Storenvy

Storenvy is ingenious, both in concept and in execution. It takes social networking, Etsy, and Pinterest and combines them all into one with an interface as easy to use as Blogspot. It allows users to create their own store to sell stuff, or to buy by browsing hundreds of items from different sellers at once. It is able to pack a lot of information and products into a small space without getting cluttered or confusing. It comes with a built-in store creation wizard to make it super easy to get out there and sell your goodies. I only wish I had thought of it first!

Saddleback

Saddleback is a beautifully and meticulously designed website that sells all types of leather products. Every element of the site contributes to its design, which is a breath of fresh air from other designs that can be weighty and cluttered, even if nice looking. The attention to detail is what makes this rich site still completely practical and usable. One particularly nice touch is that it includes a list of the sites of their business rivals, making it easy to see that Saddleback is the complete package.

Heartbreaker Fashion

Heartbreaker has a pleasant design with a good use of patterns and textures, which is what makes it different from other creative e-commerce websites. The trend has been to avoid patterns because they can distract shoppers from the product. When done right, however, it can really enhance the store front. Heartbreaker also has a handy shopping cart box in the footer of the site as well as the top. Even though it breaks the mold, it is still very user friendly, and even stronger for it.

Oi Polloi

Oi Polloi is a retro site that sells clothes and footwear. It is surprising to find that it does not have a shopping cart immediately available - only once an item is selected does a shopping cart (here called a "Basket") descend as an overlay to the site, showing exactly what you bought, what size, and how much it is, as well as a subtotal. So there is not a separate page for the checkout, which is quite efficient in my opinion. Never be afraid to reinvent the wheel!

A Modern Eden

A Modern Eden sells prints, decals, and stuffed animals with strange angular designs. It makes use of trendy colors, and where normally the bright green background would be tacky or distracting, in this usage it is not only appropriate but adds greatly to the fun and feel of the site. The ribbon highlighting the shopping basket icon is a very nice touch as well.

Patrick Ervell

Patrik Ervell sells fashionable men's clothing with a really cool twist. Where expensive men's clothes can often appear stiff or uncomfortable, this site helps guys envision themselves wearing the clothing, with use of live moving models with every product! Normally this is a huge no-no. Animations can quickly become a very bad idea, especially if there is more than one moving item per page. But Patrik Ervell accomplishes it beautifully, with a sterile white background and simple, concise text only interspersed where necessary.

Marie Catrib's

Marie Catrib's uses vivid pastel colors; friendly, bold text; and interesting dotted lines and patterns to make the pastry and bread products come alive. Some unique elements include the ability to search by vegan or gluten-free, a toggle button to hide half the website to focus on browsing, most information in the footer, and having ALL the offered products on the home page of the site. Simple, easy to use, and captivating.

Brand Neusense

Brand Neusense breaks a lot of rules by being too crowded, having too many colors, and incorporating too many animations - yet, somehow it all works. First of all, the models look like real people, not - for lack of a better word - models. Even more so, though, this creative e-commerce website stands out because the homepage focuses more on the various brands it sells and on ads than it does on its product. It is designed thoughtfully for its target market, and that's all you can ask of a web designer.

So whether you have an upcoming creative e-commerce website design project coming up or you need to revamp your e-commerce site design, use the examples above in your decisions. Doing your research and noting what others do right (or wrong) is one of the best ways to create a website that puts ordinary to shame.