In 2008, B2B companies will follow suit, but it won’t be easy. User-Generated content needs to be used in a way that accomplishes specific marketing objectives, and oftentimes B2B companies meet those objectives through Resource Centers (whitepaper, case study, and guide downloads), web forms, giveaways, or surveys. None of these online marketing tactics allow for community building, commenting, rating, “digging”, or creating profiles.

Extending this to what we do as an online marketing company that works with other businesses (not consumers), we just launched our own site, eroi.com, and there simply aren’t any social networking tools built into our primary site. We have done a tremendous amount of Web 2.0 tactics outside of our main site – four distinct blogs with built-in RSS feeds, Pageflakes, delicious, and digg capabilities, our own Facebook Group page, MySpace page, YouTube Channel, and Flickr feeds, but we haven’t pulled them all together and integrated social networking tools into our primary site. As a self-fulfilling prophecy, we could look at implementing some of these tools into our site or, even better, our products. Online support can leverage the wisdom of other customers and allow searchable discussion threads for product support issues between multiple customers. B2B technology companies can learn from Salesforce, Google and Facebook and open the API to their products to allow for anyone to build modules that easily integrate into their online products.

I guess this video reflects the wacky culture of the ultra-individualist who has defined Web 2.0 and “the long tail” of quirky interests. If you think this video is just plain annoying, please comment below, and I’ll remove it from the blog. In my eyes, it’s clever, makes its point, but is borderline gratingly-annoying. Let me know your thoughts. Thx.

So what can be taken away from these daily digital intrusions? How about some design mishaps. Surely once a design technique has worked its way into a pop up, it must be time to move on. Remember that jittery windows pop up. God that pissed me off.

Here’s a look at my most recent pop up encounter. Web 2.0 (shiverrrrr) in a nut shell. I’ve circled all the over used elements, but in case it’s not clear, here are the bullets:

• reflected graphic
• Beta button
• swirly stuff
• wings
• gradation
• repeated graphic background
• overly large call to action fake gloss jelly rounded corner button thing

Now, some of these elements work by themselves (or maybe I’ve just been told that by clients so many times that I believe it) but all together… look out! I use all these elements all the time, but my point is, whenever design starts to look like pop ups, maybe it’s time to take a deep breath, and hit the drawing board.

From brand new upstart Citizen Agency, I learned a dozen new social networking sites that I’d never heard of before that were incredibly niche, but fascinating. They drove home key points about building community online throughout their presentation such as: “these are my peops,” “they talk my language,” “they get me,” and build off of one another’s conversations. Sites I hadn’t heard about:
Dogster.com
Catster.com
Intuit JackRabbit community site
VIRB.com
Last.fm
BarCamp.org
Ma.gnolia
BareNakedApp

Also, you should know about some amazing Web 2.0 companies in our backyard in Portland:
Jive Software
Platial
Values of N
JanRain
MatchPoint

Lastly, for any of those who wanted to download my presentation on Building Community Online and Matchpoint Case Study, please download it here >>

Cheers.

What follows are the perspectives of six different people, discussing five different pieces of this puzzle that needed to come together seamlessly in order to complete a stellar site.

Strategy Development by Ryan Buchanan, CEO; Anna DeMent, Sr. Account Exec.

On a global scale, social networking is getting more and more niche for a reason. It works. Niche social networking sites foster a loyal community of users who have something very specific and valuable in common, like professional parents. Furthermore, MatchPoint has something most social networking companies do not have: a business model based on profitable staffing placement, not advertisements. It also has an exclusive network where professional parents only have full access to the entire site after a MatchPoint Regional Manager approves their profile. Therefore, it’s a highly targeted network from which professional parents, companies, and service providers stand to gain substantial value.

From a website strategy perspective, we wanted to create a much more visually appealing social networking destination than sites like LinkedIn and MySpace. We also wanted to have very clear calls to action to draw the user into the flow of the site (and accomplish MatchPoint’s business objectives as well). On the homepage, new users are drawn to “Create a Profile.” Secondarily, users have the opportunity to login, search profiles and network or search jobs. To test drive the site and see live content, we wanted to enable the user to get access to a small portion of each registered user’s profile and job information before requiring the user to login for full access.

There are three distinct users: professional parents, clients / companies and service providers. Once logged in as a professional parent, she or he can “Expand my network” and invite others to join, or select job favorites to work with the MatchPoint Regional Manager on flexible contract-job placement, or connect with Service Providers like nannies, daycare, house cleaning, or even dog walking. Logging in as a company rep, you can post and manage company job listings as well as identify talented, prospective parents to fill those jobs. Creating a service provider profile enables that person to post service listings relevant to professional parents.

Branding + Design by Todd Quackenbush, eROI Designer

Branding: a great example of when concept, execution and trust in the designer came together well.

The logo: made up of two different pieces, the mark and the type, both were customized and work with one-another but can still function independently. The mark represents an abstract “m” consisting of three elements, two of the same shapes and a point, all of which come together, implying a network of people that come together to function as a new entity. The form is clean, sharp in some places and soft and curved on others. The colors are very contemporary.

The type: based on a font but with much customization to ensure it belongs with the logo’s look and feel. Intentionally, grey was chosen instead of black, making the logo pair, or lock up, more comfortably with the orange.

The website: great because Jeff (experienced in interface and information design) was able wireframe and break down the functionality, freeing me, the designer, to focus on look and feel. Tag team! The challenge of the site was to get so much functionality on each page to feel comfortable, designed, and not crowded. We spent a lot of time going back again and again to drawing on the white board, envisioning how the user would interact with all aspects of the site and what would or would not be intuitive. This included the registration wizard, where people might expect to receive a triggered email sent to their inbox and being able to save and continue the current step they were in. Also the colors for the site and rollovers were based on the colors from the branding.

Interface Design by Jeff Reynolds, eROI Senior Designer

It has been said that good user interface design is invisible. I think it’s important to keep this in mind — that the best interfaces are generally transparent to the user to the point that end objectives are immediately recognizable.

When one is designing a simple website, allowing for intuitive interaction is not an incredibly difficult task. Users have learned through repetition to expect certain circumstances — navigation across the top or on the left side, paragraphs of body copy with “read more…” links at the bottom, etc. There is a sort of standard in simple web layout, and this is beneficial to end users for obvious reasons — people know where to go to accomplish various tasks.

The web is expanding, however, in huge ways. There is now the ability to create, and a demand for, web-based services and applications that go far beyond what people have typically become accustomed to, and what has been bred into web design. What this creates is a need for interfaces that, in some cases, are as niche and customized as the services they’re linked to. These interfaces are based around new, custom content and functionality that may have never before been done on the web (or perhaps have never been done well). So how does one design an interface that will feel comfortable and intuitive in instances where no standard has been set?

First things first, and although it may seem obvious, it’s amazing how often this is muddied: the designer has to determine the objective of the new service or application. The designer must ultimately be very comfortable saying, “Blah blah blah is what we really want our users to do.” There are typically a lot of elements that support this final conclusion, and all those supporting elements are of varying importance, but hierarchically, the idea of getting a user easily and efficiently to the information you’re providing must always be the top priority. It’s easy to let a project become overwhelming because of its many features, or let excessive design drown out the objective. This is why it’s so important to “keep your eyes on the prize” as a designer.

Next, the information being delivered has to be examined on a more granular level. Essential to any successful web project is a broad understanding and documentation of the elements necessary on the various pages that a user will be interacting with; this knowledge allows all elements to be taken into consideration, and the most complete vision of the project to be implemented from the start. There is often no way to know what the future will bring, and interfaces need to incorporate a level of elasticity so that unforeseen elements can be introduced, but having the highest possible level of information at the start is nonetheless of utmost importance.

When the designer has these details, they can begin to lay them out; here is where arguably the most important layer of design is implemented. Intuitive interaction is developed in these early stages — the grouping of similar elements, placement of objects in appropriate areas, hierarchical alignment, etc. It’s incredible important to know how a user will see these details, and to plan for it. Sometimes it’s as simple as saying, “This edit button relates to that image, so they should probably be directly connected.” Other times it’s more complicated, such as a determination of how a step-by- step process should be implemented (should users be able to go back in the process? is this going to be edited in the future? how much time is filling out these forms going to take? should we implement a save function for an incomplete process?).

Polishing typically comes after this information design stage (though realistically they’re often happening concurrently), and involves the more conventional brand implementation, and “prettying up” of the interface. It’s easy to dismiss this step as fluff, but that’s really a huge disservice. Making a project feel appropriate within its brand, and making it fun to look at and interact with, is a huge part of sustaining an audience and getting potential users excited about it in the first place. When the two levels of the design — the information and the polish — work together, the result can be almost magical.

An interface that is invisible is one that is concise, intuitive and informational.

Producing the Site by George Huff, Emerging Technologies Manager

One of the major goals of being a production artist at eROI is to build a site pixel-perfect; a person comparing a site’s Photoshop comp to what’s in their browser will see exactly the same thing. Being a major goal, this is also a major challenge. MatchPoint presented a whole slew of challenges to our production team which we addressed through use of a ton of new tricks.

As you may have noticed, there is a good amount of textures and patterns throughout the site. The layout is challenging in the sense it can’t be put in a box. There are also drop shadows everywhere, and as we web producers know, PNG images are so tricky! So what did we do?

Utilizing CSS, HTML, and JavaScript, we molded and shaped this site to be pixel-perfect, as well as keep our programmers happy with the flexibility of the content. In building MatchPoint, we walked the line between aesthetics and functionality, and as with any challenge, it inspired us.

Programming the Web 2.0 Site by Tore Gustafson, Programmer Extraordinaire

Social networking sites at their core are really a collection of a lot of common and architecturally simple applications. What is a blog from a development standpoint? Really, it’s just a few database columns including things like a date, an article and a title. Then all you need is the application framework to edit and display that information. A social networking site takes applications like a blog, or email, or adding a person to your personal network, and builds a cohesive framework for all the pieces to play together.

Building MatchPointcorp.com from scratch, however, was by no means a small task. Mapping the database architecture for a site that offers so many different capabilities was probably the most time-consuming task, not to mention building interfaces for both delivering content to the end user as well as an administration portal enabling managers to administer their users, companies and service providers, and ultimately connect them to one-another.

Probably the most enjoyable aspect of developing sites like this is getting cool Flash-like (and much more) effects working with plain old JavaScript. JavaScript frameworks like prototype and the ensuing add-ons like mootools have made JavaScript not only more consistent across browsers, but actually fun to code. If you’re a developer and still ignoring JavaScript, grab a copy of prototype and dig in!

Our lead programmer, Tore Gustafson, is going to talk about the challenges of building this site from scratch from a programming (not design) perspective:

Social networking sites at their core are really a collection of a lot of common and architecturally simple applications. What is a blog from a development standpoint? Really it’s just a few database columns including things like a date, an article and a title. Then all you need is the application framework to edit and display that information. A social networking site takes applications like a blog, like email, like adding a person to your personal network and builds a cohesive framework for all the pieces to play together.

Building matchpointcorp.com from scratch, however, is by no means a small task. Mapping the database architecture for a site that offers so many different capabilities was probably the most time-consuming task, not to mention building interfaces for both delivering content to the end user as well as an administration portal for Matchpoint managers to administer their users, companies and service provider and ultimately connect them.

Probably the most enjoyable aspect of developing sites like this is getting cool flash-like (and much more) effects working with plain old javascript. Javascript frameworks like prototype and the ensuing add-ons like mootools have made javascript not only more consistent across browsers, but actually fun to code in. If your a developer and still ignoring javascript, grab a copy of prototype and dig in!

Why is this newsworthy? Wieden has waited and waited and waited to get into the online marketing world, while its competitors like Crispin Porter (think online campaigns like Subservient Chicken) and Ogilvy (think Dove’s original “Campaign for Real Beauty” site and online video) have been in the online world for years. While wk.com isn’t exactly the most user-friendly website, it is certainly a huge leap forward into the social tagging feel of the Web 2.0 world and the site hosts a ridiculous amount of campaign content over Wieden’s 25 year history. Very impressive.

One company (Matchpoint) in our backyard came to us 6 months ago with an amazing concept – connect professional parents, highly-skilled and intelligent parents who are getting back into the workforce, with each other and ultimately to flexible, contract jobs. It has some elements to LinkedIn, but it is far more visually appealing, niche, and a hybrid full-service revenue model of having real regional managers place professionals in these jobs. Create your own profile on Matchpointcorp.com!

In Seattle, venture capital reporter John Cook, documents the top 100 Web 2.0 companies in the city alone. Here are the top 5:

Atomic Moguls: Next generation fantasy games. (New entry)

Avvo: Consumer-oriented online legal service. (Stealth)

Bag Borrow or Steal: Luxury goods borrowing service.

Beet Inc.: Online music. (New entry)

BeRecruited: Online sports recruiting site. (New entry)

Read his full blog posting with all 100 Web 2.0 listings >>

Apparently, a survey went out with lots of buzzwords that people voted on and should be avoided at all costs – there were 10 of them, but I could only remember the top 7:
7. Viral
6. ROI (sorry, but that will NEVER go away)
5. Buzz
4. Out of the Box
3. Synergy
2. Engagement
1. Web 2.0

Nick Nyhan, founder of Dynamic Logic, is the show’s Master of Ceremonies. He leads the discussion with some dazzling facts about the online marketing industry and trends. Online marketing spend is up to $18 Billion; hard to hire again; and VC money is back in a big way.

We’re living in an Era of “Control Shift + Options.” Digital is about Control.

Advertisers thinking about:
1. Engagement
2. Advertising Opps
3. Accountability

Consumers think:
1. I’m in control
2. Free Content
3. Scary Data

Advertisers / Brands must give up a lot of control to survive in this new world. Consumers are at the center with brands all around them trying to make a connection of the 7,000 marketing messages bombarding the consumer each day.

“There is no official standard for what makes something “Web 2.0″, but there certainly are a few tell-tale signs. These new sites usually feature modern web technologies like Ajax and often have something to do with building online communities. But even more characteristic among these brands is their appearance. Web 2.0 sites nearly always feel open and friendly and often use small chunks of large type. The colors are bright and cheery — lots of blue, orange, and what we jokingly call the Official Color of Web 2.0: lime green.”

Read the full article here >>