User Interface Challenges
Just over a decade ago, creating user interfaces (UIs) was a simple task; developers used whatever their tool of choice provided to create a simple MS-DOS interface. Since then, things have gotten considerably more difficult. User expectations have risen sky-high, and developers face a plethora of choices that are supposed to help them to fulfill those expectations. But which path do you take? What UI technology do you learn?
At EPS, we spend a lot of time training our developers, and one of the training programs we run on a regular basis is called “Ask Markus.” The idea is that developers can (anonymously if they want) submit questions about things they encounter in their daily developer life (and yes, the question has to be development-related). I collect these questions, prepare some material (samples, slides, etc.) to answer the question, and then present the answer to a few questions in a 90-minute training session.
Mostly, it is not too difficult to answer these questions, especially when I have time to prepare. Recently, though, I received a question that I found difficult to answer: “Out of all the UI technologies that are available to me, which ones should I learn and focus on?”
The Available Options
There are surprisingly many options for UI layers these days. There are Rich Windows Clients, based on Windows Forms technology. Unlike in the “old days,” we now not only use what is available out of the box, but technologies like GDI+ have become so accessible that you just can’t help but use them in advanced UIs. Another variation on that theme includes Windows console-based applications, although I am not sure we really consider that an advanced interface technology. Nevertheless, it is an option.
Then of course, there are HTML-based Web applications, and although ASP.NET (yet another UI technology) shields you from much of the low-level HTML, I doubt that any half-decent Web developer could get away without knowing HTML and related client-side technologies like Java Script. But even that is only half the Web-development story because there are new techniques, like AJAX, that try to overcome some of the shortcomings of Web browser clients. And if you are building advanced Web applications, you will probably get into situations where you think seriously about how the content is generated on the server. Perhaps you will even end up creating custom server controls (which isn’t nearly as difficult as it sounds). Or perhaps you have a need to display content that matches the definition of a “document” more closely than that of a “control.” In that case, you could use content transformation technologies like XSLT. (The article you are reading right now is displayed in ASP.NET using XSLT transformation.) And to make Web applications look good, you will often find yourself using style sheets.
Then there is the issue of design. Although traditional, “battleship gray” Windows UIs are clearly the domain of the developer; things are not quite as clear with the more recent generation of Windows applications have a heavier artistic influence. (I would argue that this is true for Windows XP itself.) This trend is even more obvious in Web applications, where the use of images and design is much more common. In fact, that was the reason for the code-behind model, where-at least theoretically-developers could hand over the ASPX page to an artist and get the design done and ultimately incorporated in the Web application. In practice, of course, this didn’t happen very often. Nevertheless, the need for artists and designers is very real in Web applications.
Another technology makes that need for artists and designers pretty obvious too: Macromedia Flash. Statistically, almost all browsers can display Flash content these days, and a lot of Web pages take advantage of this. Flash is definitely worth checking out, although from a developer’s viewpoint, it may be lacking a bit. What makes Flash a bit unusual for developers is the concept of animation because most developers do not (yet) think about their interfaces in terms of timelines.
But wait, there is more! In the relatively near future, we are facing another paradigm shift in UI development: The “Avalon” UI technology that will ship with WinFX and Windows “Longhorn.” (Avalon will be available for both Longhorn and Windows XP.) Avalon introduces lots of new features to the mix. For one, Avalon is a “compositional” and “vector based” interface. This means that in paradigm, it is much closer to DirectX (Direct3D) than conventional GDI-based interfaces. This is apparent in some of Avalon’s key features, such as animation and the ability to create objects in 3D spaces. Knowledge of concepts such as view-ports and lighting will be helpful for Avalon (although not strictly required). Avalon also uses a new syntax known as XAML (pronounced “zamel”) to “declaratively” define interfaces. Imagine that XAML is like a specialized XML language to define interfaces. The overall approach is not entirely unlike ASP.NET pages today. Except of course, that XAML and Avalon provide rich-client Windows features.
And the need to have artists and designers continues with Avalon. The concept of a “polished user interface” is central to the Avalon experience. This means that now we need artists that not only understand fancy graphics, but they also need to understand concepts like animation, timelines, and story-boards.
What to Focus On…
This still leaves the need to answer the original question: on which technology should a developer focus?
Well, to be honest, it is really hard to say. In a lot of ways, developers really need to know and understand all these technologies. (And for the sake of simplicity, I am ignoring technologies like Pocket PCs, Windows CE, Tablet PCs, Aux Displays, Smart Phones, SPOT, and others.) But knowing all the technologies mentioned here is not a realistic short-term goal for most developers. So here are some suggestions that you might use as a roadmap:
Web developers should familiarize themselves with Windows and vice versa. I really do not see the roles of Windows and Web developers separated the same way they used to be. I see very few applications that are pure Web applications or pure Windows applications. A developer usually focuses on one of the two, but the other is usually present as well. If you already know enough .NET to build an ASP.NET solution, you probably have enough knowledge to tackle the Windows side as well. And if you are a Windows developer and have been a Windows developer for a while, learning HTML and ASP.NET shouldn’t be a huge hurdle either. (The same is also true for WinCE devices).
All developers need to know XML and related technologies. Because let’s face it: there simply is too much XML involved in development these days to ignore it. Besides, it is not all that hard. Make sure you also understand related technologies such as XPath queries and XSLT transformation. Without understanding these, you really only get a fraction of the benefit of XML. Knowing these technologies will be useful in almost all aspects of UI development, and even beyond. It always surprises me how many developers are not familiar with XML.
Familiarize yourself with declarative programming. Some people love declarative programming and others just hate it. No matter on which side of the fence you find yourself, you probably can not afford to ignore declarative development because there is so much coming your way in almost all areas of development, and in particular, in UI development. It is also pretty cool. You might just find yourself liking it. (Check out my recent Publisher’s Point “Anything to Declare?” for some information about declarative programming.)
Learn HTML. Yup, you should have probably done that years ago. (If you have, ignore this paragraph.) You still need HTML in ASP.NET development today, and HTML-based applications are not going away. In addition, understanding the HTML approach will be helpful with a lot of new technologies. Sure, XAML is not HTML, but if you understand HTML, XAML will seem quite natural.
Check out what you can do with styles. There are many style sheet technologies. HTML’s Cascading Style Sheets (CSS) are a good place to start. Sure, they are very primitive compared to what you can do with styles in Avalon, but you’ve gotta start somewhere, right? Moving on to XAML styles will be a lot of fun. Beware though! You might not want to go back to CSS.
Start looking into animation. In Windows Forms and even ASP.NET, you change a control’s properties. In Avalon, you animate a property from one state to another. So animation will be important, and it will be easier to learn it over time than all at once when the Avalon wave hits you. A good way to familiarize yourself with the concepts of animations and timelines is through Macromedia Flash.
This probably still didn’t really answer the question in a way you (or the original questioner) hoped for. However, development is not marketing, and therefore, development answers can often not be given in a 10-second elevator ride (the nirvana for marketing guys). A lot of exciting things are happening for UI technologies. Developers and artists who are comfortable with these technologies will be able to achieve amazing results. They will probably also find great business opportunities. For those not familiar with a wide range of techniques and technologies involved, though, the air on the UI summit could get pretty thin.