2012 is here. What next for the web?

What will happen to the web in 2012? Since the advent of HTML5 we’ve seen the semantic web growing. So I guess we’ve arrived at web 3.0, right? What’s next, then?

Enter web 4.0… The concept has been around for ages now, much to the liking of web 2.0 and web 3.0 (web 2.0 started being talked about in 1995…) and the basic notion about web 4.0 is that the web as a social movement will reach it critical mass and erupt from that to the event where communities/society will take over the information as a whole. On the other hand, some say web 4.0 is the stage where 3D web will emerge finally as a part of semantic web 3.0. How those two are related, if they are related at all, I really have no clue.

However, I believe web 4.0 to be the one were people do really take charge of all information. We’ve been watching it for a couple of years now, with the conflicts in middle eastern countries, riots, natural disasters being reported live from thousands of cell phones around the world. And we also began taking notice of bad media and disinformation provided by mainstream media exactly because of these thousands of “eyes” capturing the truth.

So, regardless of what technical advances may occur (with CSS3, SVG, HTML5 and other technologies), I believe that web 4.0 will be the one to bring back “power to the people”. Martin Luther King would be proud.

 

Until web 4.0 is upon us, let’s stick to what we’ve got: http://semanticweb.com/

Word of the wise – don’t change lanes if you don’t know how’s traffic…

Today I’m down on my knees. Tired as anyone can be after deciding to change your life. Almost completely.

I decided to leave my daily job as a consultant, analyst and project manager and embrace my own projects – even if I don’t have any secured funding yet – and try to finally make something for myself.

It’s scary I tell you. Once you make a decision like that and you sign the resignation letter there’s no turning back. Specially if you have a family of five that solely depend on you. And, to make matters even more complicated, I have a huge amount of bills piling up. So, there you have it. I’m beat. Badly beat.

But really, why should you care? Well, I might be beaten, soared and completely trashed today, but the hope and adrenalin of building something from scratch and calling it mine pumps me to the max and gives me strength to wake up tomorrow at 7 a.m., get my kids to school and carry on. And my the end of tomorrow I’ll be beaten again, with more soars, physical and emotional but, no matter how destroyed I might be, the next day I’ll be up and about and will do it all over again.

And that’s the real lesson to take from all this. That and… never change lanes if you do not know how’s traffic… What that’s got to do with everything else? A lot! If you ever driven any kind of vehicle in a motorway you know you should never, EVER, switch lanes without checking for incoming traffic. Having said that, how can you know if there’s incoming traffic without sticking you head out even if just for a little while. That’s the moment of truth. That’s when the real danger is present. And that’s how I’m feeling right now. Beaten, tired and like I’m about to get struck by a truck. But, while taking the risk, I get a sense of how’s the market – my traffic – and where must I go from here.

And I know now where I must go. And I’m going. And I’ll get there. Tired, beaten, down on my knees but I’ll get there.

In conclusion, boys and girls, word of the wise – don’t change lanes if you don’t know how’s traffic… but be sure to take a peak before you do!

To create something new… why? [UPDATED]

When it comes down to get creative, often people think of picking up a brush and start doodling away in hope of becoming the next Picasso. Well, first of all, there will only be one Van Gogh, one Picasso, one Basquiat – and thousands more, but each one unique – so you’re best hope is to become the next big you.

But that’s not the real reason for this article. By creativity I was thinking about it in a more global way. For the last couple of years we’ve been looking at a growth of the number of people creating new ways to approach data. New ways to visualize it. We have concepts such as data mining, business intelligence and more for years now. But those are business related and more often than not they come down to show numbers and stats in a grid like approach. The curse of the spreadsheet as I call it. There’s really no sense in keep looking at a bunch of numbers without understanding them – or even make an effort . Most spreadsheets used in most corporations have been neglected because they’re messy, boring to look at. Even the really important stuff. But finally data visualization is changing. And people are starting to look at numbers and figures with a different and surprising way.

I started to realize this by listening to Brian Suda’s talks in SAPO Codebits back in 2009 and 2010. (By the way, Brian Suda has since edited a book “Designing with Data”.) But that was only the beginning of it all. There is a couple of famous TED Talks around this subject. David McCandless: the beauty of data visualization and Hans Rosling stats are the best examples I can remember. Fun, awarness increasing ways to show us what would be nothing but meaningless numbers.

Then again you could just say that they’re not really creating anything but using what’s already there. Well… isn’t that the real meaning of creation? You begin with a thought. That’s exclusive. But you have to put it in practice. And for that you rely on materials, sources, inspiration. All those things were already there also. It is the way you approach your idea and how you materialize it that makes the difference.

Now we have a whole new discipline. A new business really. Infographics (or info-graphics) are exploding everywhere. You’ve seen then in magazines, TV channels, the web. There are designers and developers specializing themselves on this. There are companies dedicated to infographics. And there are brilliant examples. Some funny, some just genius artworks. But it all comes down to: how to grab what’s already there for the taking and transform it in a way that makes it simple, fun and extraordinary to look at while conveying an idea and putting them in perspective.

So, if you feel the urge to create something new, why not start with the next elections polls? Or your city demographics? There’s a new perspective on creativity, right?

I’ll leave you with a couple of links to websites that have examples on good infographics.

http://sixrevisions.com/graphics-design/40-useful-and-creative-infographics/

http://www.coolinfographics.com/

 

UPDATE: Thank you to Pedro Moura Pinheiro for reviewing the text and point out some English “faux pas”.

David McCandless: The beauty of data visualizationD

Daniel M. Russel and Brian Suda

In my time as an editorial board member in portuguese B!T Magazine I have written several articles, produced a bunch of tests to miscellaneous equipment and had the privilege to talk to some of the great minds of our time. Geeky stuff mostly but still, wonderful geeky stuff. From all the people I have met I need to highlight two in particular.

Firstly, Mr. Daniel M. Russel, head researcher at Google, which granted me a phone interview that was the base of B!T’s 148 cover theme. To him personally and all the people who made that phonecall possible, thank you very much. It is wonderful to learn how Google’s “brains” work to make our lives easier.

And last but not least, Mr. Brian Suda, who I have met briefly in 2009 during Sapo Codebits and left me in awe with the “Hello world” Ancient Egypt style t-shirt (should be read “Hello to all the land”) – I am a huge fan of Ancient Egypt history. That, allied with the fact that I am also defender/fan of usability/user experience/user interface related subjects and Mr. Suda is one of the people behind Microformats – semantics rule! – lead me to contact him during Codebits 2010.

I started to take a photo of his “Hello to all the land” t-shirt and went on to exchange emails. After a while, Mr. Suda kindly agreed do write an article to be included on the first issue of 2011, related to our technological past, present and future. We had a little misunderstanding regarding character count – I asked for about 2000/3000 characters and Mr. Suda wrote 2000+ words (a bit more and we could have published a book) and so I’ve managed to translate the text to portuguese and have it published spanned across three issues. I have to say that, even if at times I had a bit of trouble translating parts of the text to avoid misinterpretations, I also had a blast reading every word.

Recently I found out that Mr. Suda has already publish the original text in his own blog. Therefore, here is the link. Hope you enjoy reading it as much as I have.

HTML Entities – the next level

Ever since I started creating webpages I came across several issues regarding Portuguese special characters. For those who are unaware, Portuguese uses lots of á à é í ó õ ã â ê and so on.

Initially the only way of solving this problem was with a bit of prayer and the correct character encoding. However, when MySQL – or any other DBs – came into the picture, things went very wrong very fast. Now, besides character encoding on the HTML document, and hoping everything would work out server side, you also had to check DB encoding, table encoding and text field encoding…

Then Dreamweaver came along and brought something I had already knew but never used because it was a pain to always be looking for the code to all those characters within words in lots of sentences and even bigger texts. And Dreamweaver made it possible for us to write as we want and it automatically converts all those pesky characters to something like Á (which equals Á) just as long you had your HTML page set to ISO-8859-1 character encoding.

As time went by the use of UTF-8 as character encoding became almost a must have in web development (something for another article) and Dreamweaver, although a very good overall tool – not always beloved by developers – led to most of us to “learn” to write with special characters in mind. Nowadays I am so used to write directly with HTML Entities in mind that I rarely use any kind of tool other that a simple text editor (I use TextMate or NetBeans most of the time).

But, as with everything, there’s always something to learn. And that’s part of the fun. Which brings us to the subject itself. We all are used to HTML Entities – some more that others – and several languages already have functions that help convert these special characters to HTML Entities, but nevertheless there are always some characters we do not use very often and require for a quick peak in order to include them in our code.

So, with that in mind, I gathered a bunch of them in one place. Here. Enjoy!

Dashes & Bullets

– dash | –

— another dash | —

⋅ small dot | ⋅

• dot | •

◊ lozenge | ◊

Quotation marks

‘ quotes ’ | ’ / ‘

“ double quotes ” | ” / “

❛ fat quotes ❞ | ❛ / ❞

trademark & copyright

Trademark ™ | ™

© Copyright | ©

Registered ® | ®

Currency

¢ Cents | ¢

£ Pound | £

¥ Yen | ¥

€ Euro | €

Arrows & directions

→ next | →

← previous | ←

» right arrows | »

« left arrows | «

› right arrow | ’

‹ left arrow | ‘

↑ top | ↑

⇐ previous | ⇐ (note that the “A” should be capitalized)

⇒ next | ⇒ (note that the “A” should be capitalized)

Return ↵ | ↵

Left ↔ Right | ↔

☞ forward | ☞

☜ back | ☜

Other

☎ Phone | ☎

✉ Email | ✉

✍ Sign here | ✍

✎ Edit | ✎

✓ Done | ✓

☑ Check | ☑

☒ Uncheck | ☒

✗ Delete | ✗

⊕ Add | ⊕

⊗ Remove | ⊗

† Cross | †

♫ Music | ♫

✄ Cut | ✄

✁ Coupon code | ✁

∞ Link | ∞

♨ Hot items | ♨

☢ Lab | ☢

✈ Flight | ✈

℗ parking | ℗

☠ Danger! | ☠

☣ Chemical | ☣

☯ Tai Chi | ☯

☮ Peace | ☮

♂ Male | ♂

☰ Row | ☰

♥ Favorites | ♥

★ Popular | ★

☆ Star | ☆

☺ Smile | ☹ UnSmile

Temperature

☂ Tempreature: 29° | ☂ / °

26 ℃ / 60 ℉ / ☃ | ℃ / ℉ / &#9731

Cards

♤ Spade | ♧ Club | ♡ Heart | ♢ Diamond

Poker: ♠ | ♣ | ♥ | ♦

♔ Crown | ♕ Queen | ♖ Rook Rank | ♘ Anothe Crown | ✠ Cross

Mathematical Symbols

1¼ ÷ 5¾ × 2 ≤ 5 = ¿    ->    1¼ ÷ 5¾ × 2 ≤ 5 = ¿

 

This article was inspired in an article in CSS Orbit.

Web Engagement Strategy: Best Practices in Web Projects: A Panel Approach (CMS WIRE)

Working as a member of various Web teams for more than a decade now has taught me that the most effective approach is to work with other Web experts who sub-specialize in content strategy, visual design, information architecture and usability.

Multidisciplinary teams seem to be the solution to large and even mid-size Web projects. I was curious to hear how other experts manage the challenges of Web projects. I asked some colleagues who I think are exceptional for their outstanding talent and commitment to the digital strategy field. Their answers fascinated me, and I hope you will find them useful and practical.

The goal of this multi-part series is to produce some best practices around Web projects, specifically starting well, setting goals and deliverables, managing unforeseen roadblocks and ending projects so that both parties feel satisfied.

My panel includes:

  • Alice Coleman, Information Architect
  • Daniel Eizans, Content Strategist (@danieleizans)
  • Michael Hogenmiller, Visual Designer (@mhogenmiller)
  • Chris Moritz, Information Architect (@chrismoritz)
  • Jeffrey Rum, Visual Designer (@jsrum)
  • Randall Snare, Content Strategist (@randallsnare)

You’ll find my takeaways at the bottom of the panelists’ answers. Thank you to my talented and fantastic panelists.

Question One

I asked the panelists what two to three pieces of information they needed to know before they begin a Web project.

Randall Snare, Content Strategist

Randall starts every project with these questions: Who are you and how is information managed internally?

I begin with, “Who are you?” It’s my first and most important question. I hope to inject some nuance, but often I am blunt.

The reason that knowing all about your clients (their roles, their processes, their frustrations, their names) is that it puts your analysis into an essential context.

Here’s an example:
Say you’re doing some content/usability analysis of a site that sells lots of stuff. And, you notice that there’s a page of pricing information that lives separate from product information. All of us would go,”Hey that’s not smart! You need to integrate a price with a product, because users need to know about price, it’s a key task,” etc etc.

But, the reason the pricing and product info is separate could be because of their CMS. They may have too many products, and a fluctuating market means their prices change weekly, and it’s too hard to find it in their system, so they make updates in one place (as opposed to 1,000 updates a week). Or, maybe it’s because their teams don’t talk to each other. And, there’s one Pricing Chief Executive guy who’s in charge of that, and the Marketing Brand Senior Managers only care about product information and couldn’t be bothered with prices.

So, my content analysis is moot if I don’t understand why it’s happening. Many bad things you see on websites are residue from internal systems, from human beings. So if I don’t know the humans, I don’t know the context, and I make content/design recommendations that cannot be implemented.

(…)

Posted by Ahava Leibtag (@ahaval)  | Apr 11, 2011

If you wish to continue this article, please refer to the original website here.

New projects

I’ve been working on several simultaneous projects and also writing the continuation of the “Bringing your ideas to the web” article series. Nevertheless I own you an excuse for taking too long.

However I have to let all of you know what’s been going on. So, I’ll keep posting also updates on all projects.

Currently I’m working on a couple of projects as a consultant and developer. I’ll post some screenshots and links as I take them forward. Here’s the first: http://www.iexplica.com.

Get back soon!

 

UPDATE

Due to several issues regarding my professional and personal life I have not been able to post regularly. Hopefully that will be fixed soon. Stay tuned!

Writing vertical text (PHP or CSS)

Ever had the need to write vertical text? No? Someday, perhaps, you will. I had that need not long ago and as usual I did what everyone else does. Googled it. And so I found a couple of solutions. And now I’m putting it all together for your entertainment. Of course I will mention my sources at the end of this article. If I should find more solutions I will edit and update this article.

Here we go.

With PHP (option 1):

<?php

function verticaltext($string)
{
       $tlen = strlen($string);
       for($i=0;$i<$tlen;$i++)
       {
            $vtext .= substr($string,$i,1)."<br />";  
       }
       return $vtext;
}
//USAGE
echo verticaltext("My text will be vertical");

?>

With PHP (option 2 – using GDlib):

<?php



header ("Content-type: image/png"); 

// imagecreate (x width, y width)
$img_handle = @imagecreatetruecolor (15, 220) or die ("Cannot Create image"); 

// ImageColorAllocate (image, red, green, blue)
$back_color = ImageColorAllocate ($img_handle, 0, 0, 0);
$txt_color = ImageColorAllocate ($img_handle, 255, 255, 255);
ImageStringUp ($img_handle, 2, 1, 215, $_GET['text'], $txt_color);
ImagePng ($img_handle);
ImageDestroy($img_handle);

?>

With CSS:

<style>

/*Safari*/
-webkit-transform: rotate(-90deg);

/*Firefox*/
-moz-transform: rotate(-90deg);

/*Opera*/
-o-transform: rotate(-90deg);

/*IE*/
writing-mode: tb-rl;
filter: flipV flipH;

</style>

Source: StackOverFlow – http://stackoverflow.com/questions/771378/php-how-to-display-vertical-text-90-degree-rotated-in-all-browsers

Sketching: the Visual Thinking Power Tool

This is an excerpt from a text by Mike Rohde from A List Apart that I strongly recommend to anyone who even considers developing any kind of work.

[START EXCERPT]

Sketching: the Visual Thinking Power Tool

As a kid, I spent hours drawing and sketching ideas that popped into my head.

I used drawing as a primary language for capturing thoughts, exploring ideas, and then sharing those ideas. Teachers and mentors encouraged me, helping to sustain sketching as a key skill throughout school and into my professional career. Good fortune has ignited my passion to become a sketch advocate, helping others rediscover sketching as a powerful problem-solving and communication tool.

I’m excited to share why sketching can be so beneficial, show samples of sketches, and provide helpful resources. My goal is to encourage you—whether you’re a designer, front-end developer, coder, writer or whatever you may be—to add sketching to your toolkit.

But I can’t sketch—I’m not an artist!

When I suggest sketching as a visual thinking tool, I often I hear “I’m not an artist” or “I can’t draw.” While I understand the hesitation, I’m here to tell you that the artistic quality of your sketches is not the point. The real goal of sketching is functional. It’s about generating ideas, solving problems, and communicating ideas more effectively with others.

When you feel inadequate in your sketching, pause and reconsider your perspective. Don’t worry how well you draw. Instead, think of your sketching as visual thinking, which works regardless of your drawing quality. Ugly gets the job done just fine.

Data Techniques: Rough Concepts

Fig 1. Keep it loose! Ugly sketches do the trick.

Why bother sketching?

There is no shortage of software or hardware tools for producing amazing work. It seems that whatever you can imagine, software and hardware can make it happen.

Adding sketching to the design process is a great way to amplify software and hardware tools. Sketching provides a unique space that can help you think differently, generate a variety of ideas quickly, explore alternatives with less risk, and encourage constructive discussions with colleagues and clients.

Let’s explore these three benefits of sketching in more detail.

[END EXCERPT]

To read the full text please follow this link to its’ original website.