Let’s start with quote: “Casanova was the first interaction designer in the world”. According to Sarah, he always found an attractive woman with a problem. He solved her problem, she was grateful and… well, you can imagine. Then he got bored with her, so he left her and started the whole process again.
And now some serious notes on how to define quality relationship (aplies to partners in life and customers as well):
Invest in quality time
Security and comfort
Dependence / independence
Regular reassurance (Say them how lucky you are they’re with you)
Actively listen and respond
Making the extra effort (little suprises like buy a flower, send a gift card to a customer on his/her birthday)
Sarah also said in her talk, that “nobody can talk at UX conference without mentioning Apple”. So true. This company was like everywhere at UX Lx. And a good half of what Jared Spool talked about was about Apple too.
Great talk.
Open session: Application Design mixing UX, Learning and Knowledge Management Methodologies - Silvia Calvet
This talk was about a project Silvia worked on and they were making some software for a goverment and most of the things they were doing was trying to make people from different departements to talk to each other.
For me nothing really inspiring there. Pity, I met Silvia before and she’s really nice person, maybe was a bit nervous before the audiance?
Workshop: Making Smart Design Decisions (Collaborative techniques for analyzing usability testing data) - Dana Chisnell
This workshop started with a KJ technique. (Link leads to Jared Spools article about it, if you don’t know it.)
We were answering the question: “What obsacles do teams face in implementing user experience design pracices?” and what we came up with was lack of time, lack of knowledge and lack of money.
It was fun to play with 50 people.
Big idea: share experience
Second thing I took from this workshop is about telling stories: People who observed sessions should get together at the end of the day and in 15 minutes or less tell each other stories what they saw. You can actually put them on the paper and your report is done. :)
Big Idea: observers buy-in
Third thing: Rolling Issues Lists
When you observe sessions, you can put notes on a whiteboard. Everyone gets a pen and writes what he considers important. Then you can put these things on a paper and work with them later.
Big idea: making sense of the data
And how to work with that? You can put them into a sheet with these columns:
Observation - what happened
Inference - what is the gap between behavior and UI might be
I’m at a UX conference in Lisbon. Everything we talk about here is user experience and similar stuff, but I think its genuinely connected to semantics, because both care about meaning of things a lot. So I’ll be posting some notes from the conference here. Hope you enjoy them.
Today I came to the afternoon sessions. There were two open sessions I attended - What’s the story? and UX 4 kids. Both great and insightful, specially designing for kids. One thing I brought from it - if you design for kids, you have to think like kids and test a lot. But be careful, kids aren’t ideal subjects for user testing.
And then there was this workshop “Copywriting for web” with Eric Reiss. And it was brilliant. However I know a lot of the things Eric Reiss was talking about, he is just wonderful speaker and he really can interact with the audience. (I actually invited him to Prague WebExpo but he can’t attend this year, he already has another conference. So maybe next year?)
Anyway - just few bullet points from the workshop for you to think about:
The most important thing for writers is shared reference. That means, that everyone knows what you write/talk about and their imagination of that thing is pretty similar to yours.
Don’t take anything for granted
Most of the things you know about SEO is bullshit
Shorter text isn’t better
Longer text often sells more
People read on the screen. Just slower and in a different way. (Oh, but maybe iPad will change that)
Hopefully this step will increase interest in Microdata and we’ll see some tools for extracting these informations from browser to actually help users, like Microformats does. Till then I’m sticking with them on clients sites.
But the freedom to choose Microformats, RDFa or Microdata and be sure, that Google actually understand them, it’s a great news.
On clevis.cz we have black&white images in portfolio. I wanted to colorize them on :hover.
I wanted to do it and had these goals:
Without styles and/or JavaScript there will be just a gray image.
I don’t want to create CSS sprite for each image, it’s time consuming and boring.
I want to use <img> tag for specifying portfolio image in my code.
I still want to preload both images (black&white and colored versions), I want to avoid blinking.
I want to fade in and fade out colored version.
I knew I will have to use jQuery, because CSS can’t do this alone.
I begun with code of a portfolio image. Semantically it made sense to me to use new HTML5 elements <figure> and <figcaption>, see html5 doctor for further explanation.
Now I decided that this code is pretty nice and I don’t want to add any anything else just to enable desired effect.
I googled to find how others are solving this. After a while I found this great tutorial on The Art Of Hand Coding. It’s using CSS sprites but it gave me the idea that I can dynamically take url address from <img> element and set it to another element as background.
But I actually needed to change that url a bit to find the right colorized image to the black&white variant.
At first it seemed impossible to me, because I’m not much jQuery expert. But after a quick google search I found this wonderful plugin created by Mark Perkins, which allowed me to change the URL.
After a while I’ve putted together this script:
It loads the right image (colorized version of portfolio images are prefixed with “color-” and generated automatically by a little Automator script) and the image is placed behind the <img> element. The only thing left is now to fade in and to fade out the colored image, which is pretty easy in jQuery and I actually used the code from The Art Of Hand Coding. It works like this: you slowly let the <img> disappeared and then the background of the link is visible.
And that’s it! All 5 goals completed, it works awesome in every browser I tested it in. (from IE6 to the latest Webkit night build). Check it out at clevis.cz/co-delame.
While lunching new web site of company I work for - clevis.cz (which looks so awesome thanks to Josef Richter) - I run into a problem I had problem to solve semantically.
If you look at our site there’re headlines like this one:
I really love their style. However they introduce a problem. The text is specifically divided into two (or more) lines just to look better. No semantics in it at all. What to do with it?
On my personal site - honzasladek.com - I run to the same problem and tried to solve it with specifying precise width. I know, this attempt was doomed to fail. But it worked with some problems on Mac and Windows alike. But Opera sometimes just didn’t render a word on the next line, line-height got broken in several browsers and other horrible things happened.
This wasn’t the best way to go. Tired of it I used <br />, which I’m ashamed of till now, but didn’t find the time to change it yet.
On Clevis.cz I used <span> elements with display:block; for certain parts of text to cause the line-break. I’m not completely happy with it but it solves the problem and it doesn’t do anything when styles are off. (But the code isn’t as clean as it could be, you know ;))
Unfortunately I can’t think of any better solution. Can you?
All our work, our whole life is a matter of semantics, because words are the tools with which we work, the material out of which laws are made, out of which the Constitution was written. Everything depends on our understanding of them.
— Felix Frankfurter on why we should care about semantics.
Yesterday (that is 2. 2. 2010) was officially lunched RDFa Working Group. It’s really an exciting news for everyone interested in semantics.
After W3C discontinued XHTML 2, many people thought, that RDFa is as good as dead. Obviously it’s not.
Among other things this group will support incorporating RDFa into HTML5 and, of course, will be updating and developing RDFa. I’m really excited about some ideas people are discussing in the group public email discussion. They could make RDFa much easier to understand and write for many people.
I’ll let you know if anything interesting happens.
This site was created in July 2009 and since then I wrote about 5 real articles. Not good.
Internet is full of blogs about web design.
Nobody needs another blog about web design.
I’m not a web designer.
If there’s one thing I’m possessed about, it’s semantics. It’s the next frontier of the web. So I’ll be writing about it.
What can you expect to read? A series about RDFa, news about: RDFa in HTML5, Microdata and Microformats, my thoughts on semantic markup and much more.
I hope one day I’ll have here guest posts about semantics and interviews with people who really care about semantics. But it’s just a plan for the future.
If you’re interested in semantics I suggest you to subscribe to my RSS feed.
P.S.: My personal thoughts about other aspects of life I’m going to publish only in Czech on my blog (sure, it’s powered by Tumblr).
Příběh Fakturoidu z pohledu člověka, který jeho vývoj sledoval tak nějak z povzdálí
Po světě spolu chodí spousta lidí, ale tihle dva se vyloženě hledali. Nevím, jak se vlastně nakonec našli, ale mělo to určitě něco společného s velikostí českého webového rybníčku.
Ze začátku vše probíhalo naprosto standardně. Nejdřív zjistili, že je baví si spolu povídat. Pak se z toho vyklubalo nějaké to pozvání na kafe.. A nakonec se jednou při diskuzi o tajemných Signálech dohodli, že si spolu pořídí děťátko.
Tedy abych byl přesnější - robotí děťátko. Normální děti už dneska prostě nejsou v módě a robotí děťátko má řadu výhod. Nejí, nespí, neřve. Akorát ho udělat trvá trošku déle.
I za použití nejmodernějších metod pro rychlý růst robůtků, jako je jízda na kolejích či ozařování jasným světlem z nakousnutého jablka ve dvě ráno, to trvalo rok.
Prenatální vývoj našeho robůtka probíhal poměrně dobře, přesně dle příručky pro mladé rodiče - Getting Real. Zodpovědní rodiče se věnovali každému detailu a velmi rychle si uvědomili, že by bylo chytré malého robůtka něco naučit, aby nebyl jako všechny ostatní děti pasivem, ale stal se aktivem.
No a co je na světě jednoduššího než český daňový systém? A tak se robůtek ještě před narozením začal učit vydávat faktury či hackovat se do databází Ministerstva Financí. Do toho musel hodně posilovat, aby vypdal k světu. Bylo rozhodnuto, že zelená s šedivou jsou dneska cool a tak nosí oblečení v těchto barvách. Jediný, komu se to nelíbilo, byly hlavičky u tabulek. A tak tabulky už hlavičky nemají…
V půlce vývoje byla touha pochlubit se malým robůtkem tak silná, že nešlo odolat. A tak byla velká párty pro pár V.I.P. hostů a ti mohli začít robůtkovi povídat, co by vlastně chtěli vystavit. Jenže zákeřní hosté si začali vymýšlet spoustu bláznovin, začali chtít řešit DPH a cosi jako Proforma faktury. Z toho se malému robůtkovi, i jeho rodičům, udělalo trošku nevolno, ale statečně to vydýchali a hosty nevyhodili. Místo toho společně strávili dlouhé hodiny učením robůtka. Rozhodně to bylo zábavnější než Windows 7 welcome párty.
No a po vyleštění robůtkových zubů (kvůli úsměvu do kamer) a koupení vánočního dárku (bílý jednorožec na hraní), nastal čas představit robůtka světu.
Přeji robůtkovi pod stromeček (a k jeho 0. narozeninám) Fakturoidovi hodně spokojených uživatelů a jeho tvůrcům, Lukášovi s Honzou, hodně platících uživatelů. :)
Osobně jsem měl to štěstí, že jsem se mohl účastnit beta testovací párty a byla to fakt jízda. Robůtek toho už spoustu umí a co neumí, to se velmi rychle učí. Zkuste ho taky!