Here are the slides and some references for my closing talk at Swiss Intranet Summit in Zürich.

"And now to something completely different". This famous line from Monty Python comes to mind whenever you click on a hyperlink that links to a PDF or ODF document. In order to indicate the type of the link I'm using icons by adding some lines to the stylesheet. Here is the code for GullFOSS, that you can copy and paste into your blog's stylesheet or CSS file without any modifications:

/* add odf icons for those links */
a[href$=".odp"] {
    padding-left: 17px;
    background: transparent url(http://blogs.sun.com/GullFOSS/resource/design/odp.gif) no-repeat center left; }

a[href$=".odt"] {
    padding-left: 17px;
    background: transparent url(http://blogs.sun.com/GullFOSS/resource/design/odt.gif) no-repeat center left; }

a[href$=".ods"] {
    padding-left: 17px;
    background: transparent url(http://blogs.sun.com/GullFOSS/resource/design/ods.gif) no-repeat center left; }

a[href$=".odg"] {
    padding-left: 17px;
    background: transparent url(http://blogs.sun.com/GullFOSS/resource/design/odg.gif) no-repeat center left; }

a[href$=".pdf"] {
    padding-left: 16px;
    background: transparent url(http://blogs.sun.com/GullFOSS/resource/design/pdf.gif) no-repeat center left; }

Finally an example. The PDF at the bottom of Bill Verplank sketches metaphors gets the PDF icon from the style statement above.

In a nutshell – You know digg? Now tweetmeme collects and counts all the links that are posted to twitter. And the little badge top right of this posting says how often this blog posting has been referred to.  Or you can click the green retweet button to simply create a simple tweet referring to this article. </nutshell>

TweetMeme Button tells how to add such a badge to your pages. For my Roller blog I had to edit the _day template and add the following code to the heading of each blog posting:

<div class="tweetmeme">
  <script type="text/javascript">
    tweetmeme_url = '$url.entry($entry.anchor)';
    tweetmeme_source = 'mprove';
##  tweetmeme_style = 'compact';  
  </script>  
  <script
    type="text/javascript"
    src="http://tweetmeme.com/i/scripts/button.js">
  </script>
</div>

The source parameter is your twitter name that is used for the composed tweet: 'RT @name title link (via @tweetmeme)'. Then the tweetmeme class is used to move the div to the right. It is defined in the stylesheet file:

.tweetmeme {
  float: right;
  margin-bottom: 3px;
  margin-left: 3px;
  }

Happy retweeting.

PS_ already adopted by Think Thin, GullFOSS, Student Views, Reviews Interactive

Each and every of my endeavors starts with an index page. A title, a logo, some ideas, related info, more stuff added over time, a log, and sooner than later the thing becomes a substantial project. This approach worked out fine for me for almost 1 1/2 decades now. First in the GoLive team in the late 1990s, where we developed a WYSIWYG web editor. Then the intranet for StarOffice' user experience team. And today I am still using GoLive to create and write on web pages for my projects.

All this is along the lines of the original vision of Tim Berners-Lee and Robert Cailliau to create a read/write web. Some time has passed, and their vision never came true. At least not in a way that could be called elegant or straight forward. Instead we see a cyber-landscape of wikis, blogs, microblogs and other social software that empower "users" to "generate content." Wrong perspective _BTW.

For the VDI project I've changed my habits a little. I set up a blog internal to Sun and start with a blog entry, a tag, some ideas, related info, more stuff added over time, and sooner than later the thing becomes a substantial project. The advantages are the same as in the early web zero-dot-nine days. I do not have to spend extra effort in communication, while colleagues can see what is happening and can provide feedback.

Here is a screenshot of my internal blog at Sun:

Tags are assigned to all entries, and the resulting tag cloud provides quick navigation for the blog. Concept diagrams, design sketches, and even photos from whiteboard scribblings are stored and shared on the blog. Other content like wiki pages are linked, as well as classical intranet pages for stuff that does not easily fit here.

I am not blogging. I say it again, I am not blogging. I just use the internal blog as a low key content management system; and that approach has proven to be useful for me and the team I work with.

>> VDI UX Story: Part 1: Concept Workshops | Part 2: User Research || To be continued...

Some time ago I've created a planet of all design, usability and accessibility blogs at Sun. That makes it easy to check and subscribe what's going on in this area. Now it was a snap to add Oracle's Usable Apps and Luke Kowalski's Blog as well.

Sun & Oracle User Experience Design

enjoy
Matthias

Sun's wiki space for Desktop Virtualization has been relaunched. New pages, and lots of feeds from Sun bloggers. Check it out at_  http://wikis.sun.com/display/DesktopVirtualization/

Hi,
here are some code snippets that show how I implemented the tag cloud on this blog.

Step 1: Log in to Roller, go to Design-Theme and select 'Custom Theme' for your blog.

Step 2: Go to Design-Stylesheet and add to the end of the CSS code:

/* Tag Cloud -----------------------------------------------*/
.tagcloud { font-size: 130%; light-height: 90%; word-spacing: 3pt; 
            text-align: center; 
            margin-top: 13px }
a.tag     { border-style: none }
a.tag.s1  { color: #a3b8cb; font-size: 70%; letter-spacing: 1px  }
a.tag.s2  { color: #a3b8cb; font-size: 90% }
a.tag.s3  { color: #5382a1; font-size: 100% }
a.tag.s4  { color: #5382a1; font-size: 120% }
a.tag.s5  { color: #35556b; font-size: 140%; letter-spacing: -1px }

Step 3: Go to Design-Templates, open the 'sidebar' template and add to an appropriate position:

<!-- TAGCLOUD -->
<div class="navsect">
<div class="tagcloud">
  #set($mytags = $model.weblog.getPopularTags(-1, 100))
  #foreach ($tag in $mytags)
    #if ($tag.count > 1)
      <a class="tag s${tag.intensity}"
         href="$url.tag($tag.name)"
         title="$tag.count">$tag.name</a>
    #end
  #end
  <a href="$url.home">(all)</a>
</div>
</div>

The surrounding navsect-div depends on your general theme. The tagcloud-div is the link to the special font style above.
Tags show up in the tag cloud as soon as they are used twice.

Step 4: The footer for each blog article should also contain the tags. For me this is coded in the '_day' template (3rd line from the bottom):

<div class="entryfooter">
<p>
  $utils.formatDate($entry.pubTime, "dd MMM yyyy")
  | <a href="$url.entry($entry.anchor)">Permalink</a>

  #if ($utils.isUserAuthorizedToAuthor($entry.website))
    | <a href="$url.editEntry($entry.anchor)">$text.get("macro.weblog.entrypermalink.edit")</a>
  #end
  #set($commentCount = $entry.commentCount)
  #if($entry.commentsStillAllowed || $commentCount > 0)
    #set($link = "$url.comments($entry.anchor)" )
    | <a href="$link" class="commentsLink">$text.get("macro.weblog.comments")[$commentCount]</a>
    #end
  | Tags: #foreach($tag in $entry.tags) <a href="$url.tag($tag.name)" title="$tag.count">$tag.name</a>  #end
</p>
</div>

Step 5: Tag your articles. Use the Tags field above the edit field when you create an article. All tags are yours. Build your own vocabulary that makes sense to you –– by adding popular tags you can drive some traffic to your site.

Step 6: Enjoy. Let me know if this was useful for you, and share a link to your blog with the new tag cloud.

-Matthias

PS_

• GullFOSS tag cloud updated
• design@sun tag cloud updated
• tag clouds for sweet, the Sun internal microblogging service
• Think Thin as well
  

I found this wonderful picture by Steve Evans of a Chinese tea store. I suppose it makes a great header for this blog.

Starting today, this blog features a "Virtualization News Feed" in the right column. It is an aggregation of several sources like some Sun bloggers and blog entries that have been tagged with 'virtualization'. You can also take a look behind the scenes at pipes.yahoo.com/mprove/virtualization.

cheers,
Matthias - Information Plumber

this blog will be revived because I have decided to join Sun's Desktop Virtualization team in Hamburg. As an User Experience Architect I will collect user requirements in this area and design a system for companies who want to replace their PCs with thin clients -- like eg. Sun Ray -- and use the computational power of the server room. You can argue that the desktop is virtual anyway - at least I like to argue that way. The desktop is a collection of metaphors, more or less consistent since the 1980s. To that extent the current development should be better called "remote desktop" -- but sooner or later both "remote" and "virtual" will become obsolete concepts for the end user.

Until then, best
Matthias

This blog comes to an end because I have decided to leave Sun after 5, nearly 6 great years at the StarOffice/OpenOffice.org User Experience team. It has been a fun ride with you.

My special thanks go to Christian, Stella, Frank, Bettina, Lutz, and Götz for the surprising and beautiful coffeepot à la Don Norman. That's magnificent!

5 new blogs on the block. I'd be happy if you stop by from time to time for some inspiration.

• OpenOffice.org User Experience - about improving the open source office suite
• User Experience & HCI Design - about delightful software and web applications
• User Experience Management - about product management and innovation processes
• Interface Culture - about computers as new media
• metascript - everything else is miscellaneous

Take care and all the best
Matthias