Designing Windows 8 Line of Business Apps Revisited
- Posted: Jan 10, 2013 at 7:00 AM
- 35,518 Views
- 18 Comments
Loading User Information from Channel 9
Something went wrong getting user information from Channel 9
Loading User Information from MSDN
Something went wrong getting user information from MSDN
Loading Visual Studio Achievements
Something went wrong getting the Visual Studio Achievements
Right click “Save as…”
In this episode, Robert revisits the Windows 8 line of business app he wrote. This app provides the ability for employees to create and submit expense reports—and for managers to view and approve or reject them. Robert first reviews the app as you last saw it and then discusses what changes he made to the app's user interface and why he thinks those changes resulted in a much better app.
He also announces that the app is now available for your downloading pleasure on CodePlex.
Comments have been closed since this content was published more than 30 days ago, but if you'd like to continue the conversation,
please create a new thread in our Forums,
or
Contact Us and let us know.
Follow the Discussion
Oops, something didn't work.
What does this mean?
Following an item on Channel 9 allows you to watch for new content and comments that you are interested in. You need to be signed in to Channel 9 to use this feature.What does this mean?
Following an item on Channel 9 allows you to watch for new content and comments that you are interested in and view them all on your notifications page.sign up for email notifications?
Thanks again Robert. Very helpful.
I would like to see how to sync offline data to the cloud. Are you planning such an episode?
Thanks again Robert. Very helpful.
I would like to see how to sync offline data to the cloud. Are you planning such an episode?
Clear lack of information density is a fail! Imagine using this app with a mouse...smh. Build business apps the way business apps should be build...enough of this big crazy squares and rectangles using the VS template with the horizontal scrolling...this UI is annoying. Instead of a 'save' menu being always visible...a user has to first right-clicked or swiped up to show 'save' button on app bar...this is a big FAIL in usability. No
Looking to future enhancements, you might want to put a pager control at the "charges" detail level. Even though you have selected a given charge at the "list" level, you may then want to just click the small arrows on either side to navigate between details without having to go back to the list. This metaphor would also apply to other categories where you have navigated down to the most detail level.
I'd say that putting the "save" button in the on-demand app bar is not appropriate here - Save is functionality that is required as part of the core function of the page (as is clear from the fact that when the page is not saved it tells you that it's not saved) so it should be visible on the page canvas.
http://msdn.microsoft.com/en-us/library/windows/apps/hh465302.aspx :
Don't put critical commands on the app bar.
Don't place commands that are core to what makes an app great on the app bar. For example, in a camera app, place the "Take a picture" command on the app page rather than in an app bar. You could either add a button to the app page or simply let people tap the preview to take the picture.
An interesting video, but I have to agree JamesB - the lack of information density and the requirement to constantly mouse down to the app bar for critical functions would leave employees quite frustrated with laptop/desktop PC's. Then again admittedly I am biased against the concept of the app bar on a m&k interface, I just don't think it works well overall in the metro apps I've used.
This seems to be a case of trying to shoehorn the metro aesthetic/design principles into an app that really doesn't seem to be benefit from it.
I was about to make the same comment as contextfree`. I might go one step further and automatically save as I go.
I also feel that JamesB's comment was insightful. I think your data entry forms have the appropriate information density, but that the "summary" views and other read-only views should be more information rich. The result is more clicks and more pages, which in medium or large LOB apps would cause the user to lose context and get lost. It's almost too much even in this small app.
The app is boring. I feel that many Windows 8 apps are this way. I suppose that developers fear what Microsoft would think if they used more than two colors. And I don't like the inconsistency in the color scheme. The summary screens use a light overall background, and dark tiles with light text. Then, data entry screens use a light background with dark text. I would make the summary screens have a darker background, and then use that with light text for data entry. (Or, do the inverse if you would rather have dark text on light backgrounds.)
Downloaded the code from the codeplex site, opened the solution and did a "Build" and got the following error and warning
Error 1 Could not find SDK "Callisto, Version=1.2.1". Expenses
Warning 2 The referenced component 'Callisto' could not be found. Expenses
Had to remove reference to "Callisto.." from the References Node and had to go to Nuget and reinstall Callisto, now the Solution Builds fine.
Have to agree with some of the comments about the UI. If I had to use something like this daily I'd go nuts. Metro UI may be okay for music/news/games apps but something as simple as this starts to reveal the limitations of this UI language. There is just way too much functionality buried under rocks. The application loses it's discoverability in exchange for a barren UI.
want to comment on it but I guess it doesn't matter since it won't change anything for win8. well, good thing 7 comes before 8.
Sorry, but metro interface just sucks for a more complex business app. Too many mouse clicks...
I agree that the modern UI lends itself well to consumption focused apps. You need to take time, however, to thoughtfully design apps which require a lot of user input in the modern UI.
I created www.windows8templates.com as a tool for rapid wireframing and prototyping Windows Store themed Windows 8 and Windows Phone 8 apps much like this one. This allows me, and many who are using my templates, to quickly mockup and test user interactions before writing a single line of code.
These PowerPoint templates also come with a library of over 200 customizable Storyboard Shapes in PowerPoint. You can also find them on the Visual Studio Gallery here: http://visualstudiogallery.msdn.microsoft.com/0221df12-b844-4cf2-9ccd-feb0fc1d2b01
@Jordan:completely agree. I don't let my team write a line of code until wireframes are locked between our designers and clients. I will check out your templates. We have been using the Windows 8 photoshop templates which still take a lot of time.
Great video and interesting to see the transition into a good looking app. Just downloaded the source on Codeplex, and the main zip file is a bit confusing as it itself contains another zip file of some of the same files. But after running Beyond Compare on the contents, I see there are differences in the sources. Maybe you should have another look at the zip file and clean it up a bit ;-) But thanks for submitting it anyway.
You mention your logic on the placement of buttons in the AppBar. I don't proclaim myself as an expert, but I think you are mistaken, or at least it seems wrong to me. I agree with the logic as stated by Microsoft's guidelines, though I think your understanding of what global means is incorrect. I will assert that global means the functionality is shared between more than one page (perhaps all), while local is specific to one. If this is what you're doing, then "select all" should be paired with "clear selection".
This is my favorite show on channel 9!
Vey cool, Robert, I like it for the design and usage.
I'm was re-watching this and see similarities that I can use for my app I am writing. Thanks,
Remove this comment
Remove this thread
close