With its use of live tiles, colors and touch-focused design elements, the Windows 8 platform presents developers with some unique user experience design challenges, as well as some unique opportunities. To help developers with this steep learning curve, we asked component and tool providers ComponentOne, DevExpress, Infragistics, Syncfusion and Telerik to discuss Windows 8’s opportunities and challenges. Here is what they had to share about developing for the platform, as well as the solutions they offer to help boost developer productivity.
Creating a simple and clean UI for Windows 8 is a lot harder than developers might think, according to Greg Lutz, product manager for Windows 8-focused products at ComponentOne. “Developers do not have the luxury of just creating a simple desktop, battleship-gray application; they have to think about design and user experience first and foremost,” he said. “Not only do they have to learn this whole new platform for building these apps, they have to learn new style guidelines. I can tell if apps have been professionally designed or not. There is this fine line, and it’s pretty clear to determine which apps had that final polish thrown on them and which ones did not.
“I can tell because they are not using solid colors and straight lines and edges. They will put just a hundred buttons in the top app bar even though they are supposed to use that for navigation. They will use gradients and rounded edges and things that do not really match the modern UI style.”
We asked Lutz how ComponentOne’s tools help developers build Windows 8 apps. “We offer a studio of many different UI controls; developers can use these in their apps to get a lot more additional functionality on top of what Visual Studio provides,” he said. “Some examples are things like a collection view with filtering and grouping…we have charts and gauges and tree views, we have a complete PDF viewer and PDF generator library, and we even have a radial contacts menu for touch-built menus.”
Lutz said the company just added a new type of radial menu control. “It is basically a contacts menu, but all the buttons are arranged in a circle. The user can expand and collapse it anywhere on the surface of the app, so it is kind of like a compact, touch-friendly menu. It is versatile for any type of application.”
So, developers will need to keep these design and user experience elements in mind as they’re creating their apps. But Lutz added that there are performance considerations. “Since we are dealing with tablets and mobile apps, most of them will get their data from the Internet, so you will always have to do stuff asynchronously so that the app doesn’t freeze as it is pulling stuff from the Web,” he said.
The name of ComponentOne’s product designed for Windows 8 and Windows Store apps is ComponentOne Studio for WinRT XAML. When asked if developers can use it and HTML for Windows 8 apps, Lutz said ComponentOne’s current product is only for XAML, but he added that if developers need HTML support, they can find that in Visual Studio.
ComponentOne also supports development for Windows 8’s animated live tiles in the form of its C1 Tile Control, which gives developers animated live tiles that they can put in their own application. “Developers can replicate the Start Screen experience in their own apps for things like flipping and sliding animations as well as touch-down interactions,” he said. “This is when a user pushes down on a tile and it sort of reacts to their finger.
“The C1 Tile Control is a smaller control that we offer, but it is another one that is designed for Windows 8. Of course, one of ComponentOne’s specialties is all of our data visualizations like charts and gauges. These [are] simple to very advanced data visualizations: bar charts, pie charts, line charts and area charts.”
As far as the best way for developers to handle spreadsheets and sorting within spreadsheets when creating for Windows 8, he said ComponentOne has another product called Spread WinRT. “It is essentially a spreadsheet component that developers can use in their own apps. Sorting is pretty straightforward, you can tap a column header and it will sort,” he said.
“But for Windows 8, I would recommend to someone needing to provide a filtering or a grouping UI that they do it in a pop-up menu that’s launched from an app bar button. That would really match the Windows 8 style. For example, it may pop up from the bottom app bar as opposed to a dropdown within the UI, which is probably what you would be used to in WinForms and desktop apps.”
There are also bandwidth considerations that developers need to be aware of when developing for Windows 8. Devices are being used more and more on satellite networks instead of Wi-Fi and, therefore, performance could be spotty. But there are solutions for this.
“One solution is that apps can download and store data locally, and they can be viewed offline,” said Lutz. “So when a user runs the app, it downloads a certain amount of information and stores it locally in the app’s data folder. Then, the next time the user runs it, they do not necessarily need to have a strong Internet connection to view what was previously downloaded. This idea is not necessarily specific to Windows 8, but Windows 8 does have a very specific way to do this that is different from other apps.”
Visual Studio 2012 is necessary
Developers still have to use Visual Studio 2012 to create Windows 8 applications, according to Julian Bucknall, CTO of DevExpress. “Visual Studio comes with a set of controls and components that you can build into a Metro application,” he said. “It comes with all the tools which allow you to publish that Metro application to the Windows Apps Store. Microsoft, because they want people to take up Windows 8 and to use Metro applications, provides all of the tools you need—as a base—to create these kinds of applications. They have guidance on the user interface: What it should do about touch, colors; what it looks like in the Start screen when you have tiles; and how often you should update the tiles.”
What DevExpress does, Bucknall said, is add on to that experience with its product for Windows 8 development called DevExpress Windows 8 XAML. He said they provide a set of controls for Metro applications that are not provided by Visual Studio.
“We provide grids of information, so you can have rows of data and columns of different values and so on,” he said. “We provide a map control for Windows 8. So, let’s say you use Google Maps on the Web, but what if you are writing a Metro application—which is your sales tool—and you want to show a map of the U.S. and where sales are being congregated. We have a component for that, which will display a map, and you can then populate the map with overlays for whatever you are trying to show.”
Metro applications, according to Bucknall, need to have visualizations emphasized. “You have people using it on tablets, so there may not be a keyboard, there will not be a mouse and they are going to be using their finger,” he said. “They want a kind of rich visualization of data, whatever that may mean. And they are into swipes and they are into zooming by pinching and all that good stuff.”
For Windows 8 development, Bucknall said DevExpress has rewritten all of its controls—be it charting, grids or the map—to work primarily with touch. When we asked him if there are dropdown menus in Windows 8, he replied, “The metaphor tends to be different, I would say. You swipe side to side. Yes, there might be buttons that actually do a menu-type thing, but it can’t be on hover.”
Bucknall said that this is a big problem with websites today. People are still writing their websites assuming the user has a mouse. “When you view the website on the iPad, you go to that particular URL on your iPad and you don’t have a mouse, you have your finger,” he said.
One of the other challenges that Bucknall said his company is seeing is that traditional desktop applications written for Windows XP, Vista or 7 could get away with a lot as far as design goes. “People use the menu, so okay, there is a menu, then file open, all that kind of stuff,” he said.
“But with Windows 8 applications, it’s like you really need some kind of graphics designer onboard. The paradigms have changed, the metaphors have changed, and people are used to swiping or touching or zooming with pinch. The usual developers have no idea about that stuff, like what should they do to make it more attractive visually.”
A challenging development
According to Infragistics, Windows 8 offers design challenges for developers as they build for it. “App developers will need to care more about design and UX than ever before due to Windows 8 having a very strong design language that focuses on simplicity,” said Dean Guida, CEO of Infragistics. “With a reduced emphasis on toolbars and menus, developers need to explore new ways of presenting their content and application workflows.”
Another challenge, according to Guida, will come from many Windows 8 machines being touch-enabled. Therefore, “the best desktop applications will find ways to take advantage of the opportunities presented by these touch-screens,” he said.
There are new options for developers for Windows 8. For starters, the new touch-based tablet and laptop form factors will give developers an opportunity to explore new ways of presenting their content to users. “Touch provides users the ability to directly interact with and manipulate their data,” said Guida. “Windows 8 developers are also able to take advantage of the new Share charm that opens up the ability for applications to work together to complete workflows for their users.”
For instance, an application that creates pictures would be able to share them through any application on the system that is capable of sharing pictures via the Share charm. But Guida said that perhaps the biggest opportunity for app developers is the Windows Store, which he said will allow developers to sell their applications. Desktop developers will want to make sure they are taking advantage of touch devices if they detect touch input is available for their users.
“Some desktop developers may even want to redesign their application to match the design of Windows Store applications,” Guida said. “This is a stylistic choice that is not required, but may be appropriate for some applications.”
Guida said that Windows 8 has a strong focus on design and that the best-selling apps will most likely be the ones that have been designed well. Because of this, he said that Infragistics’ Indigo Studio allows developers to prototype their application ideas before they get started with development. “Once the design is ready, Infragistics offers beautifully-designed data visualization controls for both XAML and WinJS application developers,” he said.
“These touch-optimized and extremely performant controls offer advanced charting and enable data grid scenarios to be completed with ease.”
Getting beyond keyboard and mouse
“We have about 40+ different controls and frameworks for core UI development on Windows 8,” said Daniel Jebaraj, VP of Syncfusion. “Metro Studio, our free product, is more of a developer productivity tool, and it’s also useful for designers in many cases. Metro Studio is packaged with 2,500 icons that can be edited by users and customized easily without having to be a designer. It helps developers and designers to bridge that UI gap that Windows 8 brings.
“I think there are many aspects to Windows 8 development that make it a little different from traditional desktop or Web-based development. I think the most often-cited difference is designing for a touch UI. With a keyboard and a mouse, you have a certain feel to it that many developers are very familiar with… It is a very well understood paradigm.”
Jebaraj said that touch is also getting to the point where it’s more understood. “If you look at tool tips, the most common way to get contextual information in the Windows sense is to hover over something to find out what it is about,” he said. “With touch, that is not possible, so you need to have your own kind of way of making sure that contextual information is readily available in a manner that does not confuse users.”
Another example he gave is that it is common to have UI actions such as groupings, so if you have a spreadsheet UI or a grid UI, and you want to group by a certain column, it is easy to drag-and-drop by the column with your keyboard and mouse. “It is not so easy to drag-and-drop with touch because with touch, you use touch for so many different things, and how do you really start the drag process? How do you initiate it and how do you end it? These are paradigms that are really well established on the desktop. So, touch by itself is something that we have to design and build around,” he said.
Jebaraj said another problem for developers is the notion that everything surrounding performance should be designed for asynchronous connectivity. He said that Microsoft’s recommendation is that anything that’s going to take longer than 50 milliseconds should be asynchronous. “You don’t really make the user wait on anything,” he said, “so I think that gives the perception of a very high-performance UI.”
He said that synchronous development is easy for developers. “You just write something and you wait for it to complete and then, you do the next thing,” he said. “Now with asynch, that’s a whole new set of challenges. You really have to make sure that you handle errors and you are able to give feedback as to what is happening, you need to have a way to cancel something. And all of this needs to be accounted for in the UI also, in a friendly way.”
Another challenge to Windows 8 development is that there is a whole level of graphics work that is required with this kind of UI paradigm. “If you look at older desktop applications or even more modern Web applications, you still have a pretty prescriptive way of doing things,” Jebaraj said. “You can get away with limited customization; you do not need to have your own graphics team and you can still produce a nice UI. This is because so much is already well understood.
“With Windows 8, I think the graphics part is substantially different. The graphics look and feel a certain way, and if you want to blend in with and do well on the platform, you need a whole new level of graphics-related work. So this could mean that you have to add new resources to your team or bring additional, external resources to bear. The whole UX gains a new level of importance within the development team.”
Three Windows 8 challenges
A second big challenge with Windows 8 development, Japikse said, involves data storage syncing and what he called “the occasionally connected story.” He gave the example of Microsoft Outlook, which he called an occasionally connected application. “I can be on an airplane that does not have Wi-Fi, I can be answering e-mails and hitting send, and they will just sit in my outbox until I get connected again and then it will sync.” He said that, especially with the Surface (where there is no built-in radio), there’s only Wi-Fi, so you’re not always connected. “If your application absolutely depends on you being connected,” he said, “then it is not going to work.”
A third challenge, Japikse said, stems from the lack of a wide range of high-quality controls that ship with Windows 8. “If you look at the date and time picker that ships from Microsoft, it’s nowhere like the date and time picker that you have on Windows Phone, which is the nice wheel that you can spin around,” he said. “The date and time picker that ships with Windows 8 for developers to use out of the box is literally three dropdown boxes, as opposed to just taking what they already wrote on [Windows Phone] and porting it over.”
Japikse said that Telerik has RadControls for Windows 8 XAML and RadControls for Windows 8 HTML, both of which can address the challenges of Windows 8 that he pointed out.
“If you look at our grid controls, there’s built-in sorting, built-in filtering, the ability to add in through very little bit of code custom filtering, and custom sorts,” he said. “But out of the box, you just set a property on the grid and you get filtering, sorting and grouping. Don’t write your own grid. If you’re building a grid, you’re not moving your company forward. If you’re building a chart or an image editor, you’re not moving your company’s application forward. We make compelling controls that are very easy to use that are customizable with very little code—or sometimes no code by just setting properties.
“And all of our controls are built native from the ground up, so we are not just putting a Windows 8 wrapper around something that already existed for Windows Phone or WPF. We’re optimized for touch, we’re optimized for the Windows 8 experience, for the different display sizes.”