Working with Feature Sets and Initial Prototypes

Posted by admin on Dec 1, 2009 in innovate, prototype
Quickly mocking up a feature list, so feedback and iteration can begin.

Quick mockup of a feature list, so feedback and iteration can begin.

So you have started a new project, you have a list of features and requests but not much else. Everyone wants to see ideas asap. Seems simple enough, but where do you start? You have sketched a few things out, but the team should have a chance to play around the experience, right?

In Sketchflow there are several ways to rapidly explore and test concepts. Above I used the SketchStyles to create some of the features with sample data.
Then I made a starter app flow, with a couple of the initial pages of the site and several layout options.

Initial Sketchflow Map with layout options.

Initial Sketchflow Map with layout options.

Next, the landing page, comped as a wireframe, with labeled content areas and links to the option pages.

Landing page start screen with stickie labels.

Landing page start screen with stickie labels.

The buttons go to different variations of feature placements for the team to test and get a feel for.

Feature placement option 1.

Feature placement option 1.

Feature placement option 2.

Feature placement option 2.

Now, I can send out these initial ideas to the team and get their feedback, with the in-browser Sketchflow Player. Meanwhile, I can go back and finish flushing out the other features. But I have already started the experience conversation and engaged the entire team. Win-win!

Tags: ,

 

Did I mention I am writing a book?!

Posted by admin on Jul 10, 2009 in design, innovate, prototype
A sneak peek at the Dynamic Prototyping cover design.

A sneak peek at the Dynamic Prototyping cover design.

Chris Bernard and I have embarked on a book for designers by designers. This will be a easy hands-on way to jump in and use Sketchflow in Expression Blend 3. We will also be sharing our thoughts on creativity, design process, sketching, idea capture and prototyping. The books website, www.dynamic-prototyping.com has links to a free chapter of the book and everything you need to get started.

Let me know what you think : )

Expression Blend 3 has launched, you can test it out here!

Tags: , , , ,

 

Sketchflow Part 2 – Fast and Easy Interactivity

Posted by admin on May 18, 2009 in design, prototype
Navigation wire up in Sketchflow. Note: I trimmed the right click options for clarities sake.

Navigation wire up in Sketchflow. Note: I trimmed the right click options for clarities sake.

Us designers may find ourselves designing a touch or gesture based interface on the fly or being asked to provide interaction in an early prototype for clients. The struggle comes in as we start to tackle expressing and selling a movement or navigation without building the entire experience and spending hours working with the developer to flush out what is actually feasible.

Here I have built a simple site project and created several pages to be explored by a client. First I linked my button to its destination page by right clicking and selecting: Navigate to, then selecting ‘Gallery’ (once you have created some pages in Sketchflow, it will show you those page options as places to navigate to in your prototype project).

Showing 2 ways to navigate thru the prototype with the Sketchflow Player.

Showing 2 ways to navigate thru the prototype with the Sketchflow Player.

Next I launched the feedback player by pressing F5, or Project>Run Project. Here you can navigate thru the project pages you have created with the navigation provided by the Sketchflow Player or in the more traditional manner by clicking on the buttons directly.

Creating these assets and wiring them took me about 5 minutes. This simple project is ready to share and collect feedback from team members and clients. And the code created is real, continuously editable, can be enhanced and richened as the project progresses.

For more Blend 3 details, visit here.

Tags: ,

 

Opportunity Knocks, Austin – MGFest

Posted by admin on May 5, 2009 in event
I sketched this as I was thinking about the transition from anything is possible to reality.

I sketched this as I was thinking about the transition from anything is possible to reality.

If you are interested in Sketchflow in Blend 3 or Silverlight there is an amazing chance to get your feet wet with it, right around the corner. These sessions will be small-size, personal and very hands on.

Resident Silverlight expert, Michael Scherotter , Media Experience Evangelist from San Francisco, will be auditing the Silverlight classes and brings a ton for technical, social media and motion expertise.

The invariable Chris Bernard and I will be talking about dynamic prototyping and Sketchflow on Thursday, May 14th. This class will require an NDA, but you will have the first chance to drive on Blend 3 and Sketchflow. This will also be an opportunity to provide your feedback on the software that will be directly communicated to the Expression product team; you will be helping to impact the future of our product offering!

Lots of talented agencies will be on hand, Cynergy and Thirteen23 to name a few.
All MGFest details are here.

Tags: , , ,

 

Upcoming Events and Conferences

Posted by admin on Apr 23, 2009 in event

There are some neat events and conferences coming up that I am looking forward to. If you are in the neighborhood stop by and say hi! I will be presenting on prototyping and Sketchflow in Blend 3 mostly. If you drop in to see me, send over some feedback on my content or pointers on what you would like to see more of.

The Houston Web Design Meetup Group – April 28th

My fellow Microsoftie, Jared Bienz, Architect Evangelist, will talking about dynamic prototyping and Sketchflow.

Motion Graphics Festival, Austin, TX – May 11th-17th

Chris Bernard and the some of the UXE gang will be hosting an interactive Sketchflow workshop. We have Mason Dixon to thank for putting this event together.


The Big (D)esign Conference, Dallas, TX – May 30th

I will have a fun lunch time sketching workshop and Chris Koenig will be discussing the future of gestural interfaces. Special thanks to Brian Sullivan for creating this conference.


UPA Conference, Portland, OR – June 8th-12th

Will Tschumy and I will be presenting on ‘Crafting User Desire’ with your product and putting on a workshop. Looking forward to going back to  Portland, I have missed Stumptown Coffee something fierce.

Tags: , ,

 

Why Static Wireframing Is Dead

Posted by admin on Apr 9, 2009 in design, innovate
My static wireframe with drop shadows and click arrows.

My static wireframe with drop shadows and click arrows.

Over the years I have painstakingly poured over simple to complex wireframes for client work and it always seems to net the same results and questions. No matter how hard I try to convey my ideas, there is still a lot left to imagination which seems to create more questions, more concerns and many more wireframes. I have tried giving more fidelity with visual direction like; drop shadows, arrows and descriptive text filled with action and interactive words. In presentation meetings I stand in front of my projected images and dance through each slide, utilizing as many verbal and non-verbal cues as I can muster. Of course I enjoy walking and talking through the intent and emotion of my ideas, but it is a huge expense of energy. And inevitably there are concepts lost in the fray.

In the course of a month I have attended 2 workshops and 2 conferences where the anthem is the same: We can do better. Our design process should be better. It should mimic the true iterative, fast paced nature of not just our industry but the products we create. Designers and developers alike are asked to be efficiency experts for our clients and the dreams and vision they invite us to build, yet we are not able to provide the same for ourselves, our daily work and the weeks and months it takes to bring an idea to reality.

It has not always been our fault. We do what needs to get done with what we have in front of us. I had always hoped for better, thinking that I could just fix the pass-off process between design and dev or devise a better overall production system where everything ‘just works’. *Insert Magic Here* But change is frequently difficult to create and sell to teams, because it involves more time to adapt in the beginning; time being the one precious nutrient we can never seem to get enough of.

This is a call to arms to every designer and developer in the community. Let’s unify our efforts. If we combine our process with the right tools we can answer the designer question: Will this FEEL like we want? And the developer question: Can we build these ideas? Yes, I am talking about Sketchflow in Blend 3. It’s the first time I have seen a software tool truly solve these issues and answer our battle cries. No more smoke and mirrors, no more duct tape. We deserve better and haven’t we earned it?!

Tags: , , , ,

 

Sketchflow Part 1 – Non-Destructive Iterative Design

Posted by admin on Mar 26, 2009 in design, innovate
Sketchflow in Blend 3 screenshot of hand-drawn, functional assets.

Sketchflow in Blend 3, screenshot of hand-drawn, functional assets.

One of the main problems I have always had with the design process is how much time gets ultimately wasted creating elements and assets… We sketch, then wireframe, then create a static comp screen in Photoshop; we might even add some interactivity in Fireworks (cringe). Usually, in each of these stages the assets are scraped when it is time to move into the next phase of the project. Us designers faithfully and loyally do all of this in the name of accurate communication of our ideas to the client, in hopes that they will say, ‘Yes! We want THAT’.

This, of course, is just the beginning. Designers then spend countless hours iterating and revising to perfect the product and the user experience vision. But for the first time, we have a tool that dissolves the destructive nature of our process at the root; Blend 3 with Sketchflow. Over the next few weeks I will walk you through how to begin to improve your process, saving time and creating flexibility where designers had little before.

The design community has been starving for a truly iterative software experience and I think this answers our prayers. Here is a 57 minute video demo of Sketchflow from MIX. Here is the full list of new features in Blend 3. More to come, but direct message me on twitter if you have specific workflow scenarios or particulars you would like to see flushed out in Sketchflow!

Tags: , , ,