All this tab candy makes me think, do I need more RAM memory on my computer?

For me the key point of this talk comes between minute 11:24 and minute 13:05.

Mike’s advice is not to follow your dreams, not to pursue your passion but instead understand the world around you and do what you need to be thankful and successful at what you do and eventually happy doing it.

Like any other project you start by clearly defining the objectives of the campaign. With Viral campaigns it’s practically set. Most of viral marketing campaigns intent to obtain visibility for the brand, person or product.

These campaigns don’t intent to sell anything, not directly at least, that would probably not work as well as expected but instead they intent to focus attention on the brand creating a hype and eventually word of mouth.

For this you need to focus your campaign on your target audience. Know your demographic and Geo target, understand what might make an impact and take advantage of it.

Ideas

After defining the objectives of the campaign you need to brainstorm ideas. At this moment you and your team should get really creative. In the past I participated in a small sprint where a team of 5 to 6 people gathered in a closed room and shared ideas. This process allowed us to share knowledge and create a strong start point.

Here’s how I like to brainstorm ideas:

1. Gather a team on an isolated room. Make sure that team has people from different departments, ages, genders, etc.
2. Get something to write ideas where everyone can see them clearly
3. Ask the team to shoot ideas from their heads in 15 minutes
4. Use additional 5 to 10 minutes talk to your team and determine what ideas are worth developing
5. In the end I take the ideas and investigate trying to develop concepts and strategies for each one.

Now come a tricky part. You have your ideas, you have created concepts now you need to focus on what will engage people and make people spread this idea.

Motivation

If you want to go viral you need to make users act on their own. You need to study them, understand where they are coming from and what is attractive to them. The problem comes when you want to create something global. For example in Portugal, a while ago, many people shared a video from a group of comedians in Angola. This video had no impact, once so ever in Spain a country with a very similar language and costumes. The same happened with other group of comedians from Portugal.
On the other hand in late 2009 I found a Spanish video telling a very peculiar story that I called “The funniest story of 2009“. Turns out the video is older than that but the story, in Spanish with Portuguese subtitles, made me laugh so hard that I even cried.

Reminding me of that I got curious and explored around the subject of motivation and found that there are 4 particularly effective ways to motivate people to take action regardless of their age, gender, culture, language, etc.

• Possession – offer something they want
• Gratification – Make people feel good by sharing
• Instant Satisfaction – Make people feel happy
• Awesomeness – Go big

Possession – give something people want

The most common use of this technique are contests where you have the big prize which is normally something really expensive and most of the target audience want and low cost prizes to reinforce participation the contest.

By pitching the sense of possession of people you are motivating them to take action. You show the objective and tell them if you want it, than you need to do that, and so they will.

Other ideas are giveaways or giving users something they want. I hear this everyday on the radio where most of them use social media sites, particularly Facebook, to give their audience tickets, gifts, etc.

Gratification – Make people feel good by sharing

The best example I can give of a viral marketing campaign based on gratification is the breast cancer campaign “what color is your bra?” where woman all over Facebook received the following message:

Some fun is going on…. just write the color of your bra in your status. Just the color, nothing else. It will be neat to see if this will spread the wings of breast cancer awareness. It will be fun to see how long it takes before people wonder why all the girls have a color in their status… Haha .

This campaign spread worldwide and asked nothing in return from the people involved. There was no fund raising, no giveaways, just the gratification of doing something for breast cancer.

Instant satisfaction – Make people feel happy

What is instant satisfaction? Remember the first time you saw Jeff Dunham – Achmed the Dead Terrorist video?

I remember laughing uncontrollably for a long time, even when I saw the video for the second and third time when I knew exactly what they where going to say.
This feeling of laughter and happiness was my instant satisfaction. The video made me feel great as I watched it and by the end I only thought on sharing it with my friends and apparently over 100 million people had the same idea and the result is one of the most visualized videos on Youtube which made wonders for Jeff Dunham career.

Doing something awesome – Go big

The JK Weeding Entrance Dance went live in July 2009 and in the past 12 months has gathered over 50.000.000 views.

Jill and Kevin met when Kevin’’s childhood friend, Jeff, married Jill’s college friend, Ann, in 2005. They were both in the wedding party. Jill could not resist Kevin’s wit and charm. Kevin could not resist Jill’s intellect, nor her remarkable dance moves.

As a result of sharing this original video on Facebook, Chris Brown song Forever, the song you ear on the video, had a burst in sales achieving #6 on iTunes in just one week since the video release July 2009.

Early in 2010 Jill and Kevin decided to make something positive out of the video went on to support Sheila Wellstone Institute, an organization focused on ending domestic violence in North American communities, by allowing people to donate from the official video and cause website. This action collected over 30.000 dollars in just over 3 months.

In September 2009 the Black Eyed Peas organized the biggest FlashMob in the world for the 24th anniversary of the Oprah Show. While many argue whether this can be called a Flash Mob, the result in unarguably something awesome.

This campaign has been passed around millions of times and served as inspiration of many other marketing campaigns. One of my favorites being TAP Christmas Flash Mob show at the Lisbon Airport.

Notice that no campaign is trying to sell. Viral marketing does not intent to sell and this is where most marketeers, accounts and CEO’s fail to understand the investment in viral marketing.

U.V.T.A – The primary Viral Marketing Results

During my personal brainstorm session about viral marketing I ended up typing a bunch of words in my notes that I later resumed into Users, Visibility, Trust and Awareness or UVTA, the primary results of a viral marketing campaign.

Here’s how standard viral marketing works someone comes up with an idea and shares it. If it’s good it gives the user something they want or instant satisfaction, therefor they will like it and share with other users.
This is online word-of-mouth and it will bring you visibility through the users. If this is a positive campaign it will strengthen the user – brand relationship. In the end users will acknowledge the brand positively thus creating a positive brand awareness.

A great example of positive brand awareness is Starbucks Facebook page. It went through a strange viral outcome due to Starbucks actions and customer support on Facebook and Twitter. Their actions made users spread the word about what they were doing and they were doing something social, something innovative that took the brand to the top of Facebook and achieving over 10 Million Facebook Likes.

I hope you find this article useful and I ask you to share it with your friends and contacts. My intentions at this point is gathering insights around the subject of creating and developing viral marketing campaigns and hope it will lead to people sharing thoughts and insights on the subject. I would really like to know what you have to say.

Mário Andrade

“Start building a network of fellow entrepreneurs that understand your passion and don’t make you feel guilty about always chasing it.”
Cameron Herold

Personally, I love the idea of raising kids to work for their money instead of just giving them money. Let’s incentive and teach them to be creative on ways to make more money instead of just getting them as an allowance. On the other hand entrepreneurs don’t really have all the advantages a normal worker has such as the obligation of full paid vacations, sick days and dental care and eventually retirement.
Don’t get me wrong, I’d love to be an entrepreneur but I also believe that in my country there’s no solid ground for this.

I’ve love to get your point of view on this. Do you believe being an entrepreneur is suitable for your children or even for you? Or do you prefer the financial security of a company worker?

Konigi has been one of my favorite websites when it comes to IA related subjects. On top of that Konigi also sells some interesting products. The Wireframe Notepad is a paper block containing contains 50 sheets of paper (8 1/2 x 11 inches (~ 21 x 27 cm)) with grids created specifically for sketching wireframes.

The grids are drawn with a non-photo blue (cyan) ink that allow you to scan the sketches without the grid. Also the 24 columns grid system makes it compatible with CSS grid frameworks.

The biggest upset come when you want to order it. It’s only available in the US.

Cost: $9 each block (50 sheets)

Alternatives to Konigi’s wireframe notepad

• Paper Browser – A free grid system with 960px width separated by 32×32 pixel squares. The paper is proportionally scaled for 1024×768 screen resolution.

  It comes as a PDF format so you can use it for digital work or simply print it for sketching.

• Browser Sketch Pad by UI Stencils.Cost: $9.95 (each Pad comes with 50 sheets)

  Download PDF format:

  • A4 Browser Sketch Pad Template
  • Letter size Browser Sketch Pad Template

Other useful resources

• Free Printable Sketching Wireframing and note taking
• A Collection of Printable Sketch Templates and Sketch Books for Wireframing

Pencils, pens & markers

photo by pigpongm

A while ago I remember reading about Pencils, Pens & Markers Sets used for offline wireframing.
Personally I’ve been in love with a Staedtler Noris H3 pencil for years. I’ve tried other models and brands but this one is the special one for me. I also own some coloring pencils of a brand called Milan and I find them great.

Usually if you are sketching wireframes you are not supposed to use color, but when sketching with paper you might want to describe certain actions or add notes and color can help in certain concepts of your visual information.

On Wireframe Magazine post they point out the most popular brands for wireframe hand sketching are Copics, Tombow and Primacolor. Unfortunately they are also some of the most expensive.

Website Stencil Kit

Although this resource kind of goes against the main idea of this post, practice productivity by hand drawing freely, sometimes, as information architects we need to do accurate straight-line sketches.
UI Stencils has this really cool set of kits of website stencils, iPod stencils and iPad stencils for offline sketching.

The includes a stainless steel stencil with commonly used iconography and a pixel based ruler, a Zebra Mechanical pencil, 2 UI Stencil stickers and a downloadable .PDF letter or A4 paper template.
Personally I like to sketch freely although having a notion of space, especially compared to

My personal resources

Although I made this list based on what some of the most known people in IA and UX use for their work, my personal resources are a bit similar but from different brands and economically more accessible.

• A4 Ambar drawing block
• Staedtler noris H3 and B2 pencils
• Uniball UM 100. The Uni-ball eye needle UN-167 also seems interesting.

It’s a very basic stock, I’m always trying to keep expenses down. On the other hand it’s important the people you work with, co-workers and clients, get a good impression from you and your work. I was fortunate enough to get a free wireframe notepad at UX LX, courtesy of London User Research Centre, afterwards I bought a decent set of pens and pencils.

Sometimes I print Paper Browser or this wireframe template by Alfonso Bozzelli for some quick sketching. Problem is that if I draw the whose website on these templates, clients usually think this is how it will show on their screens with no scroll. A quick workaround is drawing a straight line and explain what is above and bellow the fold.

I guess I’ve covered the basis for offline wireframe sketching. There are some color and visual concepts to be considered but that will be another post

I’d love to get feedback from you. Feel free to add to this post. Leave a comment.

Communicating with other users in Yammer

Like I mentioned Yammer works very similar to Twitter so you can use basically the same commands to communicate and search. For example you can mention someone by adding @username to your “Yam” or send a personal direct message by typing to:username.

Yammer allows you to attach files up to 50Mb with no limit in the amount of data stored at your network, meaning you can upload as many files as you want, as long as they are not over 50Mb.
Another great feature is the ability to follow people and tags, allowing you to be on top of project conversations via Yammer, E-mail or RSS feed.

Pricing

Yammer has 3 pricing plans with fairly reasonable pricing per user per month, Free, Silver and Gold.
If you are simple looking to communicate the free version is all you need but if you are looking for more control a paid version is advisable. Check Yammer’s pricing page for full list of features available on each plan.

How I use it

In March 2010 I started working on a startup company called Oferta Global – Web marketing services as a web and seo consultant. I felt the need to implement a few tools to improve our archiving and communication.

In April Oferta Global implemented Yammer to help improve organization and project management and with it the whole theme has a common place to share conversations and files regarding the projects we are working on, categorize messages using tags and keeping an archive of all the exchanged messages. The best of all is that Yammer works just like Twitter which made it a whole lot easier to use.

For me the biggest difference I find using Yammer comes when I’m searching the archives for a specific message or file when comparing to the hundreds of emails, many times what I want is a reply between many other replies and the whole email system is just a mess.

I recommend you give it a try, it’s free. It might not be the perfect tool for all businesses but can really improve internal communication. And in case you are still suspicious about giving it a try, companies like Adobe, AMX and Fox use Yammer so why shouldn’t you?

A vertical search engine differentiates from a regular search engine due to it’s focus on a given subject or content type.

Topic focused vertical search engine
A great example of topic based search is Trip Advisor, a website with great information for people who are looking to travel.

Content focused vertical search engine
Media Type search can be found on sites such as Youtube, Vimeo, Flickr and others, where you search within specific media file types.
For example when I’m looking to fix CSS bugs my basic instinct makes me search on Google but if the first page doesn’t return the best answer for my problem I use Delicious, for books I use Amazon, etc.

The advantage of using a vertical search engine is that it will narrow the amount of information indexed which will result in more relevant search results.

What is Semantic Web

Semantic web can be interpreted as an intelligent, self-learning web. The future of semantic web will belong to services that will understand the user and deliver them the best answers for it’s need.

While it’s not perfectly clear for users, semantics have been implemented on several websites for a while now. Amazon was, as far as I know, the first site to implement a semantic user experience when it started suggesting further products based on users preferences. When a user bought a book, Amazon’s software would recommend other books based on purchases made by users who have bought that very same book. The result was a massive increase of sales and profit.
Google also is improving it’s search engine by reordering search results based on user navigation history.

So it’s fair to say a semantic web, or Web 3.0 as some call it, is each more a reality and not a trend. This brings me to this posts topic:

Can Vertical Search Engines coexist in a semantic web?

Personally I see vertical search engines as a the first step into the semantic web concept. I believe some people will say there completely separate things and I’d love to hear a different opinion on the subject.
If I want to find a needle inside a huge barn and know the needle is inside a haystack, I’ll search only inside the haystack. The haystack is my vertical search engine.

Using the same metaphor with semantic web once I’m inside the barn I’ll get a suggestion the needle is probably on the haystack, along with a picture of how the needle might look like and also where in the haystack it will probably be.
Eventually, once I find the needle, related subjects such as strings, other kinds of needles, groups, etc would be suggested as a complement to my interest on the needle.

Being the first time I searched for something I would also get suggestions related to hay and the haystack but if I show no interest in that, further similar searches would not retrieve those suggestions.

What do you think about the future of vertical search? How can it grow in order to survive on a Web 3.0 environment?

Download WordPress Theme CSS Reset

Eric Meyer’s CSS Reset

A CSS reset will set all default values of HTML elements to zero. This will improve cross-browser CSS compatibility as different browsers will set different values for HTML / XHTML elements.

Eric Meyer’s CSS reset it a wonderful CSS reset for default HTML styles but when it comes to WordPress you need to contemplate WordPress default CSS styles.

WordPress default styles

As I mentioned before WordPress, as a CMS, creates some default CSS classes that applies to HTML elements and that you must include in your Theme style.css file in order for the Visual Editor (WYSIWYG Editor) to work correctly:

.alignleft {
   float: left;
}
.alignright {
   float: right;
}
.wp-caption {
   border: 1px solid #ddd;
   text-align: center;
   background-color: #f3f3f3;
   padding-top: 4px;
   margin: 10px;
   /* optional rounded corners for browsers that support it */
   -moz-border-radius: 3px;
   -khtml-border-radius: 3px;
   -webkit-border-radius: 3px;
   border-radius: 3px;
}
.wp-caption img {
   margin: 0;
   padding: 0;
   border: 0 none;
}
.wp-caption p.wp-caption-text {
   font-size: 11px;
   line-height: 17px;
   padding: 0 4px 5px;
   margin: 0;
}

Beyond these classes there are others to take in consideration. These classes are applied when showing categories, specific pages, widgets, links and so on. I’ll leave them blank so you can personalize as you wish. All the elements where the following classes applied have been reseted by Meyer’s CSS Reset.

When you put all of the CSS together you will get a complete CSS Reset for WordPress themes. Ready to go, ready to use on your own themes.
You can download the WordPress Theme CSS Reset by clicking on the link or just copy / paste the following code on to your style.css theme file:

/* WordPress WYSIWYG default syles */
.alignleft {
   float: left;
}
.alignright {
   float: right;
}
.wp-caption {
   border: 1px solid #ddd;
   text-align: center;
   background-color: #f3f3f3;
   padding-top: 4px;
   margin: 10px;
   /* optional rounded corners for browsers that support it */
   -moz-border-radius: 3px;
   -khtml-border-radius: 3px;
   -webkit-border-radius: 3px;
   border-radius: 3px;
}
.wp-caption img {
   margin: 0;
   padding: 0;
   border: 0 none;
}
.wp-caption p.wp-caption-text {
   font-size: 11px;
   line-height: 17px;
   padding: 0 4px 5px;
   margin: 0;
}
.aligncenter, div.aligncenter {
   display: block;
   margin-left: auto;
   margin-right: auto;
}
/* WordPress template default classes */
.categories {}
.cat-item {}
.current-cat {}
.current-cat-parent {}
.children {}
.pagenav {}
.page_item {}
.current_page_item {}
.current_page_parent {}
.current_page_ancestor {}
.widget {}
.widget_text {}
.blogroll {}
.linkcat{}
/* Eric Meyer's CSS Reset v1.0 | 20080212 */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
/* remember to define focus styles! */
:focus {
	outline: 0;
}
/* remember to highlight inserts somehow! */
ins {
	text-decoration: none;
}
del {
	text-decoration: line-through;
}
/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: collapse;
	border-spacing: 0;
}

Related links:

• Eric Meyer CSS Reset
• WordPress Codex CSS documentation

If you are looking to take your project beyond wireframing you might like to create fluxograms with the Scenario tool, comment on your project and define the requirements which help creating the project documentation.

It’s a very complete, useful and functional tool but there are too aspects I must refer to and hopefully JustinMind Prototyper developers will implement this in the future:

1. Importing new widgets or stencils. One thing that makes OmniGraffle so grate is the possibility to use stencils created by others. This can make the difference for very boring wireframes to sexy wireframes. For what I’ve tested you can create your own widgets as long as they are in image format. In wireframes presentation is 80% of captivating your client.
2. Fluid workspace. I am forced to work on the reduced canvas area while wireframing. I should be able to put that window on a different monitor.

Link: Justinmind Prototyper

1. A Primary Optical Area
2. a strong follow area
3. a weak follow area
4. and a Terminal Area

The higher left portion of the page is the user primary focus, it’s where the eyes will automatically focus regardless if the user is searching for something, wanting to read or just doing a quick scan on the page.

The second stage of the reading habit is moving to the higher right portion of the page, you can think of it as a follow up from the left portion but less important. It’s not a good idea to break the reader’s experience created from the starting point. Meaning that if you have a call to action the user will stop at this point and act.

The lower left portion is the blind portion of the Gutenberg diagram, although readable the user will not give much importance to content in this area of the page.

When the user reaches the lower right portion of the page there is a break in the reading / page scan process and the user will need to take an action. This is the perfect spot to insert call-2-action such as buttons, links, forms, video, etc.

By understanding the reading patterns of the users who visit your website you are able to place the most important content in the areas where they will be most effective.

If you’ve read about web users reading patterns you probably read Jacob Nielsen’s report on the F-Shaped Pattern that shows the lower right area as the less important area. I wouldn’t say this theory is wrong but consider the F-Shaped pattern for users that are scanning the page and the Gutenberg Diagram for user that are reading or genuinely interested in the content.

For example, a user is searching for information about the Gutenberg Diagram and reaches this article. The user will look at the diagram image and read the lines above the image starting an inverted Gutenberg Diagram.
If the user is looking to buy a product on E-bay I believe the primary pattern on the product listing pages will be a typical Gutenberg Diagram.

On the other hand when a user is searching for information on a search engine and finds multiple articles about it, the user will engage an F-shaped pattern when visiting those pages trying to find quick and concrete references to it’s search.

Complementary readings:

• 10 unexpected online user behaviors to look out for
• Design To Sell: 8 Useful Tips To Help Your Website Convert
• Life below 600 pixels
• F-Shaped Pattern