Thursday, May 24, 2007

Using Blogs to write Specs?

I was having diner at Harvard Sq. with a couple of friends from Endeca, talking about user experience in general and its challenges, when occurred to me that Blogs would be a great medium for writing specification documents. What of an epiphany! Real people posting comments about a spec document, or should I call it "specBlog"?

Who actually reads specs... thoroughly?
The truth about spec documents is that you spend a lot of time writing, creating mockups, thinking through every step an end-user may take, to end up with a 40+ pages document that nobody reads - thoroughly. No targeted comments are ever made, people tend to browse the pages and only make a comment when they have a question about a mockup or two.

Targeted sections
Using blogs to write business specs or functional requirements would provide everyone the opportunity to dissect a large document into smaller sections or chapters, which could be released faster (a section every other day) and get immediate comment from your team.

Another good aspect I see about using blogs as medium is that you can actually split the arduous task of writing the entire document by yourself. You could assign sections to different people.

Better distribution
By using blogs, the intended "readers" can actually subscribe to the blog and receive an alert, e-mail or event via a feed reader. I would think that the reader would be more inclined to read a smaller section and make a quality and targeted comments immediately.

Based on quick and faster comments, the author of the section, can actually refine the post and engage a conversation among everyone.

Tagging the specBlog
Let's assume that the name of my blog is "ACME Specs" and inside my blog, we have many posts about different products. Each time I write a post about a particular section for a single product, I could use tags to categorize my post and link it to other related posts.

Now, here's a cool scenario, a post could be used in different products, in other words, if I have a global widget, such as an "AutoComplete Input Field" that is used throughout all my company's products, the very same post can be referenced in future specs by simply tagging your post with the same keywords used in the previously written post.

Wrapping up
If your boss is really anal-retentive about having full documentation - just for the sake of having it - you could simply copy the sections from your blog and package it into your old and beautiful Word template.

I would love to get comments about this idea and will be trying out myself on the next opportunity I have and share it with you.

Posted by at No comments:
Labels: , , , , , , , ,

Wednesday, May 23, 2007

WPF 3rd Party Controls

Just a quick post on some of the WPF User controls out there.

NetAdvantage for WPF 2007 by Infragistics
Infragistics has released a WPF control suite that includes: xamDataGrid, xamCarouselPanel, xamCarouselListBox, xamDataCarousel, xamDataPresenter, xamEditors, some StylePacks, and a xamples Browser.

Chart FX for WPF by Software FX
Software FX has overhauled their Chart FX product to take full advantage of the 2D, 3D, animation, and data binding capabilities of WPF. Contact wpf@softwarefx.com for more information or download the NDA and apply for the beta program on their site.

Actipro Wizard by Actipro Software
Actipro Wizard is a WPF-based .NET control that conforms to the Wizard97 specification.

DataGrid for WPF by Xceed
A free, fully-featured, professional data grid control for WPF. Check out the Xceed DataGrid for WPF LiveExplorer for an online demo.

Wpf-Ribbon by DevComponents
A Guidelines-compliant implementation of the Office 2007 Ribbon control for WPF. Similar to their DotNetBar control for Windows Forms.

Actipro Ribbon by Actipro Software
Actipro Ribbon is a WPF-based .NET control that conforms to the Office 2007 UI specifications.

blendables by identity mine
Their essentials mix includes: Zoombox, ElementSnapshot, Carousel3D, ChromelessWindow, DragAndDrop, Pie, OSChecker, TimelinePanel, EvalBinding and SimpleBinding, NumericRangeToObjectConverter.

Please post any new links you may know.
Thanks,
Marcelo
Posted by at No comments:

Wednesday, May 16, 2007

HTML 5 Proposal Approved by W3C

Exciting news for the front-end developers!

Back in October 2006, the father of HTML, Tim Berners-Lee - currently the W3C Director, acknowledged that the W3C has had difficulties on keeping the HTML language fresh and evolving:

"The perceived accountability of the HTML group has been an issue. Sometimes this was a departure from the W3C process, sometimes a sticking to it in principle, but not actually providing assurances to commenters. An issue was the formation of the breakaway WHAT WG, which attracted reviewers though it did not have a process or specific accountability measures itself. "

Reinventing HTML, by Tim Berners-Lee on October 10, 2006

In a surprise session, HTML 5 was proposed by the WHAT Working Group (founded by representatives of Mozilla, Apple and Opera) to the Consortium and accepted by the majority of the voting participants. They've also agreed on the following:
  • The WHAT Working Group’s HTML5 (Web Applications 1.0 and Web Forms 2.0) will become the current working draft, and an extensive review by the new working group will now take place.
  • The final W3C specification will be named "HTML 5".
  • The W3C specification will be edited by Ian Hickson (Google), editor of the WHAT-WG’s HTML5, and David Hyatt (Apple/Safari).

So, why was the WHAT Working Group formed?

In 2004, after a W3C workshop, Apple, Mozilla and Opera were becoming increasingly concerned about the W3C’s direction with XHTML, lack of interest in HTML and apparent disregard for the needs of real-world authors. So, in response, these organisations set out to with a mission to address these concerns and the Web Hypertext Application Technology Working Group was born.

These days, the WHATWG is a growing community of browser vendors, web developers, and other people interested in the development of the the next generation of HTML and related technologies, specifically designed to allow authors to write and deploy applications over the World Wide Web.

Now, what everyone is itching to know...

What improvements will HTML 5 bring to our world?

This is an extremely exciting question and at a first glance, this new language is very promising:
  • New DOCTYPEs and DTDs
  • New Structures
  • New Semantics
  • New Controls - Whoo-hoo!
  • Client Side Form Validation
  • DOM APIs
  • And the introduction of Repetition Model

New elements

Document Structure

Data

Applications


In addition to the above the input element's type attribute can now have the following new values, which enables a bunch of new native controls:

  • datetime, datetime-local, date, month, week, time, number, range, email, url


New Attributes

An overview of all elements from HTML4 that got new attributes in HTML5.

Element Attributes

  • a media?, ping
  • area ping
  • base target
  • button autofocus, form, replace, template
  • fieldset disabled, form
  • form data, replace
  • input autocomplete, autofocus, form, inputmode, list, min, max, pattern, step, replace, required, template
  • li value (no longer deprecated)
  • meta charset
  • ol start (no longer deprecated)
  • select autofocus, data, form
  • script async, defer
  • style scoped
  • textarea autofocus, form, inputmode, required

HTML4 didn't have a concept of an attribute that applies to every element. HTML5 calls such attributes global attributes. The following attributes from HTML4 are made global attributes:

  • class, dir, id, lang, title

The following new attributes are global attributes:

  • contenteditable, contextmenu, draggable, tabindex

HTML5 also has global attributes that also can be applied on elements from other vocabularies (when namespaced):

  • repeat (Web Forms 2)
  • repeat-start (Web Forms 2)
  • repeat-min (Web Forms 2)
  • repeat-max (Web Forms 2)

Changed Elements

These elements have new meanings in HTML5 which are incompatible with HTML4. The new meanings better reflects the way they are used on the Web or gives them a purpose so people can start using them.

  • a – The a element without an href attribute represents a "placeholder link".
  • address – The address element is now scoped by the new concept of sectioning.
  • b – The b element now represents a span of text to be stylistically offset from the normal prose without conveying any extra importance, such as key words in a document abstract, product names in a review, or other spans of text whose typical typographic presentation is emboldened.
  • hr – The hr element now represents a paragraph-level thematic break.
  • i – The i element now represents a span of text in an alternate voice or mood, or otherwise offset from the normal prose, such as a taxonomic designation, a technical term, an idiomatic phrase from another language, a thought, a ship name, or some other prose whose typical typographic presentation is italicized. Usage varies widely by language.
  • label – The browser should not transfer focus from the label to the control unless such behaviour is standard for the underlying platform user interface.
  • menu – The menu element is redefined to be useful for actual menus.
  • small – The small element now represents small print (for side comments and legal print).
  • strong – The strong element now represents importance rather than strong emphasis.

Dropped Elements!

That these elements are dropped means that authors are no longer allowed to use them. User agents will still have to support them and HTML5 will probably get a rendering section in due course that says exactly how. (isindex for instance is already supported by the parser.)

  • acronym (use abbr instead)
  • applet (use object instead)
  • basefont
  • big
  • center
  • dir
  • font (allowed when inserted by WYSIWYG editors)
  • frame
  • frameset
  • isindex
  • noframes
  • noscript (only dropped in XHTML5)
  • s
  • strike
  • tt
  • u

Dropped Attributes!

Some attributes for elements included in HTML4 are not allowed in HTML5:

Element Attributes

In addition, HTML5 has none of the presentational attributes that were in HTML4 (including those on. Any attributes defined on elements that are not in HTML5 are (obviously) also not in HTML5.

APIs

HTML5 introduces a number of APIs that should help in creating web applications. These can be used together with the new elements introduced for applications:


Character Encoding

The character encoding can be declared using the meta element, but the syntax of the meta element has changed. In HTML 4.01 and earlier, the meta element was:

<meta equiv="Content-Type" content="text/html; charset=UTF-8">

In HTML5, the syntax was simplified to remove the unnecessary markup, yet still remain compatible with the encoding detection implemented in most existing browsers.

<meta charset="UTF-8">

DOCTYPE

In HTML 4, the DOCTYPE was long and complicated, and very few people can actually remember it all. The complex PUBLIC and SYSTEM identifers are used to refer to the DTD. But because there is no DTD in HTML5, we’ve taken out the PUBLIC and SYSTEM identifiers and left the minimal amount of code that is both easy to remember and triggers standards mode.

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

Thus, in HTML 5, the DOCTYPE will simply be:

<!DOCTYPE html>

This does not apply to XHTML 5, for which there is no DOCTYPE sniffing and no need for any DOCTYPE at all.



Here’s a very interesting presentation by Lachlan Hunt at the Web Standards Group meeting in Sydney on 2007-01-25.

You may also download the presentation slides (PowerPoint) and audio recording (Ogg Vorbis).

Cheers!
Marcelo Paiva

Posted by at 3 comments:
Labels: , , , , , ,

Friday, May 11, 2007

All you need to know and learn about Silverlight

There are hours of video presentations and tutorials below. Please leave your comments, just so that we can create some discussion around the subject.

Take the first step, downloading Expression Blend:

Expression Blend 2 May Preview

Marcelo



Update 1! Immediate Expression Blend Training

  • Training Videos
  • Webcasts

    • Update 2! More Samples from MSDN
    http://blogs.msdn.com/expression/articles/543834.aspx


    Simple WPF Demos

    Color Swatch: An app that allows you do envision different color possibilities for interior decorating.

    Animation Studio: This is a nifty little animation drawing tool.

    Photo Book: Flipping a book of images using 2 1/2 D.

    Video Shelf: Video mapped onto 3D planes, library like navigation.

    Viewer3D: A motorcycle with particular camera moves to highlight different features


    Infragistics' WPF Controls

    Great examples on user controls, will need to download and install - Check the requirements. I found it to be slow, considering it's running locally.

    http://www.infragistics.com/hot/wpf.aspx#NetAdvantageforWPFBeta


    Chart FX for WPF

    http://www.softwarefx.com/sfxWinFxProducts/cfxforWpf/


    Sample Files and Resources

    http://wpf.netfx3.com/files/default.aspx


    WPF/Silverlight Blogs

    http://thewpfblog.com/

    http://blogs.msdn.com/tims/

    http://blogs.msdn.com/okoboji/archive/2006/09/20/764019.aspx

    http://blogs.msdn.com/tims/articles/475132.aspx

    http://channel9.msdn.com/tags/WPF


    WPF/Silverlight Tutorials

    Whole Bunch of Code Samples and Video Tutorials

    http://contentpresenter.com/

    http://movielibrary.lynda.com/html/modPage.asp?ID=359


    Channel 9 - Expression Blend Videos

    Introduction to Blend Part 1: Introduction

    Introduction to Blend Part 2: Interface Overview

    Introduction to Blend Part 3: 2D Build

    Introduction to Blend Part 4: 3D & Effects



    MIX07 - Sessions About Design and Front Development

    Designer/Developer Productivity in Windows Presentation Foundation

    http://int1.fp.sandpiper.net/soma/applications/silverlight/v1/videos/XBD08.wmv


    A View from the Front: Real World Experiences of WPF and Silverlight

    http://int1.fp.sandpiper.net/soma/applications/silverlight/v1/videos/DES01.wmv


    Building Rich Web Experience with Silverlight and Microsoft Expression Studio for Designers

    http://int1.fp.sandpiper.net/soma/applications/silverlight/v1/videos/DES02.wmv


    Designing with Microsoft Expression Web: Today and Tomorrow

    http://int1.fp.sandpiper.net/soma/applications/silverlight/v1/videos/DES03.wmv


    Getting UNSTUCK: Merging Design and Development in a 2.0 World

    http://int1.fp.sandpiper.net/soma/applications/silverlight/v1/videos/XD008.wmv


    Using the Desktop and Web to Power Ultimate User Experience Applications

    http://int1.fp.sandpiper.net/soma/applications/silverlight/v1/videos/XD013.wmv


    PANEL DISCUSSION: Getting Unstuck: Enhancing Designer and Developer Collaboration for Mutual Success

    http://int1.fp.sandpiper.net/soma/applications/silverlight/v1/videos/PAN12.wmv


    PANEL DISCUSSION: Culture, Design, Business, and Technology: What? So What? Now What?

    http://int1.fp.sandpiper.net/soma/applications/silverlight/v1/videos/PAN13.wmv


    THE END - At least for now.
    Posted by at No comments:
    Labels: , , , , , , , , ,

    Wednesday, May 9, 2007

    Designers and Front-end Developers Wanted

    Welcome user experience community!

    This is our first post and I would like to write a few lines to talk about the objective of this blog.

    There many blogs out there informing us about user experience design and development, but very few of them tend to concentrate on a wide range of new trends in this industry - and that's what we are embarking to do!

    In the next few days, we'll be engaging and selecting design strategists and researchers to assist us on delivering quality and timely content.

    If you are interested on jumping on the boat with us, please leave a quick comment or send me an email (mpaiva@gmail.com) to join the team.

    Cheers,
    Marcelo
    Posted by at No comments:
    Subscribe to: Posts (Atom)