As part of building a Windows 8 app for Codemash I have gotten the change to dive into the new layout controls featured in Windows 8, namely the GridView.  It has been an extremely challenging experience, but not due to technical difficulty, but rather the new thought process involved in creating an application.

I would say many of Microsoft’s developers are only now beginning to understand just how important design is, but they may not yet totally realize that design is fast becoming a developers task.  Gone are the days where saying “I am a developer, I don’t design”, developers of the future will be expected to design applications and consider usability as part of that process, more so than in the past.  Those of us engaged in mobile development are already doing this.  This is not to say that Graphic/Web designers are irrelevant in the future, quite the contrary, there will always be a need for professionals who specialize in design.  However, more often than not when developing an application a developer will find themselves without this support but still with the expectation to create something usable.  Remember, while the best solutions come from designers and developers working together, ultimately functionality outweighs look.  Developers are still needed more than designers.

What this means is, it still more important that the application be able to carry out a task than looking good.  However, the usability of the application is an extremely close second, especially with respect to mobile form factors.  The ability for you, as a developer, to not only code the application but also identify how the app will be used are essential skills for the future, especially as mobile form factors becoming the primary target platform.  Professional design skills will always be the domain of the expert, but cross pollination of design skills benefit both sides.  Few projects actually require professional design expertise to achieve a highly usable state.

Before everyone starts getting worried and running out to buy design books there is good news.  Microsoft, and other companies, have already realized this and have been infusing controls with good design features, leaving developers to make minor tweaks and pick colors.  Windows 8 is a great example of this.  Microsoft has already done the research and decided on a particular approach developers can work in to create high usability in their apps, Apple has a similar approach whereby XCode enforces the rules of the HIG (Human Interface Guidelines).

Designing the Codemash App

The biggest learning experience of the Codemash app came from understanding what I feel is important to the user.  This understanding is born of many conference apps and attending conferences in general.  What questions do I often hear people asking?  I want to make sure that information is readily available, otherwise the provided booklet is more valuable that any app.  I have to remember, I am creating an app to replace a book so I have to provide an experience that can be seen as greater in value than the book.

I felt that the most important thing for the conference attendee was what sessions were “upcoming”.  Thus I choose this to be the first screen the users sees.  A full session listing can be accessed through additional screens.

To achieve this I used the GridView which allowed me to create a tiled look with the Session Title, the Speaker Name, the Room and the Track.  The idea here is quick glancability at the general topic of the session (title and track), who the speaker is and where I can find it.  Of course the user can tap the box and be taken to the full details.

I allow for three lines of text for the title, if it goes beyond that, it is cut off.  This is not the final design, I want to get some additional feedback on the text size and letter spacing, see if I can clean this up.

You can see that the two most prominent text blocks are the Track and Title.  This is intentional because it is designed to attract the eye and make a decision.  The conclusion I came to is the Speaker is simply not normally a deciding factor in choosing a session for most people.  For this reason, its size is smaller than Track and Title.  Smaller still is the Room, since this is certainly not a deciding factor, but information that is needed after a decision has been made.

I should point out that the data I am using, for the most part, is from DevLink 2012.  This was in an attempt to use something that could closely the mimic the data Codemash will provide once the REST API is updated with the new sessions.

Next Step

While all of the pages in the application are done, I don’t plan to show everything, I want some of this to be a surprise, as I anticipate many people will have Surface for CodeMash, I know I will.  That is the big question mark at the moment, how does this look on a mobile form factor.  I can run this all day on my laptop but I need a mobile Windows 8 form factor to really get a sense of the usability.

Back to the Design

Let me make clear one point, when I refer to the process of coding, I am not referring to HTML/CSS.  As a developer if you are NOT familiar with this, I would seek a new profession.  Given the importance of the Web, I am left aghast at any developer I find with no knowledge of how to develop for the web.  The best designers are also those who are good with HTML. Understanding how a design will be implemented is a key skill as it helps you understand what works and what does not.  This is no different than a programmer who pushes back on a feature that the current code base will not support.  The more we understand our target the better we can achieve it.

It will never be necessary for designers to replace developers, nor will it ever be necessary for developers to replace designers.  But as developers who can already understand the back end code behind how something works, have the ability to contribute to how it looks and is interacted with is an essential.  Cross pollination between these two realms should be encouraged.