Metro UI (...just bare with me! Screenshots enclosed!)

ChrisP · 09-15-2011, 04:52 PM

If Windows 8's new UI turns out to be even slightly successful then it is a safe bet that monitors and computers generally will come with touch built-in, and so while not useful for gaming itself, a metro style Steam client application may become a real possibility some years down the line.

To that end, as an enthusiast of UI and UX I decided to experiment with the concept of a Steam Metro UI. Please note that these shots (especially of the store) are very early WIP mockups.

Obviously there are a number of design decisions that would have to be made, as well as lots of end-user testing for this to be a viable UI for steam, but for an experiment I think it's an interesting start and welcome constructive feedback!

Non-Metro Steam UI Concepts:

Steam Store Revision (Very Early WIP) - (older version)

Mangr0v3 · 09-15-2011, 10:41 PM

I'd love something like that, but I doubt we'll see it. Valve very strongly seem to be sticking to one interface to rule them all, which only leads down the path of bad things.

Quote:

Originally Posted by ChrisP

Obviously there are a number of design decisions that would have to be made, as well as lots of end-user testing

Are you new here?

ChrisP · 09-16-2011, 04:47 AM

Lol, I'm only new in terms of account creation, Still I had to write it!

I've also started a store product page available here. Note there is a lot of clutter... I mean information on the actual steam store pages which I am still trying to work out how to present.

I know it's unlikley such a UI will be implemented, Valve does tend to stick to their guns with regards to Steam as you say.

The Kins · 09-16-2011, 04:54 AM

Quote:

Originally Posted by Mangr0v3

I'd love something like that, but I doubt we'll see it. Valve very strongly seem to be sticking to one interface to rule them all, which only leads down the path of bad things.

Valve are working on a new fullscreen UI for TV/joypad setups called Big Picture Mode. It definitely won't be Metro, but it'll very likely be different from the current UI.

Nice mockups, by the way.

cylon · 09-16-2011, 05:14 AM

Touchscreen for tablets etc. Fine. No problem, seems to work well and it's what windows needs in order to make things easier. I've had a winmo phone with a touch screen and REALLY SMALL buttons that you need to stab with a fingernail to choose, i can see similar problems with tablets and this issue resolves it.

BUT... for desktops, i can't really see much point - especially for Steam. You turn your PC on, reach across the desk - swipe into windows, tab into steam, swipe to the library, tap on the game.... then forget the screen and use the mouse and keyboard...?

Unless your screen is right in your face, isn't it just going to be tiring sitting with your arms out reaching for the screen all evening? Mouse and keyboard, arms rested on the desk, click click click - sorted!

Nice mock ups though :P

Peewi · 09-16-2011, 06:15 AM

Quote:

Originally Posted by The Kins

Valve are working on a new fullscreen UI for TV/joypad setups called Big Picture Mode. It definitely won't be Metro, but it'll very likely be different from the current UI.

Nice mockups, by the way.

Which they haven't talked about at all outside the initial announcement.

Nice concept. Did you do it as a Windows 8 app or just with image editing?

ChrisP · 09-16-2011, 06:23 AM

@cylon: I'd forgotten about that announcement! Microsoft have stated the Metro UI is just as good for a keyboard and mouse as for touch. Plus if you have a gamer who solely uses a controller, he could in theory do away with the mouse and keyboard.

All that said and done, I have used Windows 8 and feel MS have a little way to go before their new UI is totally fit for kb/mouse so, like you, I remain sceptical! Still their UI is pretty sexy IMO!

@Peewi: The screenshots I've posted are mostly photoshoped shots based on a Windows 8 app from the developer preview. I have started an app but so far look nowhere near that 'polished' yet, well essentially it's just a rough home screen so far!!

Mangr0v3 · 09-17-2011, 02:51 AM

Quote:

Originally Posted by ChrisP

@cylon: I'd forgotten about that announcement! Microsoft have stated the Metro UI is just as good for a keyboard and mouse as for touch. Plus if you have a gamer who solely uses a controller, he could in theory do away with the mouse and keyboard.

All that said and done, I have used Windows 8 and feel MS have a little way to go before their new UI is totally fit for kb/mouse so, like you, I remain sceptical! Still their UI is pretty sexy IMO!

Agreed. It currently sucks with a keyboard and mouse, they have a lot of work ahead of them to make it remotely usable.

Quote:

Originally Posted by ChrisP

@Peewi: The screenshots I've posted are mostly photoshoped shots based on a Windows 8 app from the developer preview. I have started an app but so far look nowhere near that 'polished' yet, well essentially it's just a rough home screen so far!!

I did too - I didn't have much time to work with it (System.IO.Path and Microsoft.Win32.Registry are both Missing In Action), so it's currently just a default template with some broken code

Gorge · 09-17-2011, 03:38 AM

i dont like the idea of a touchscreen and i dont like the idea of metro UI in steam.

i think metro UI is the worst choice Microsoft have ever made. it looks terrible and they have just taken ideas from what works on phones and put it on the desktop. bad idea

Aemony · 09-17-2011, 04:18 AM

Looks nice. In terms of a Metro UI interface for Steam, I really agree with something like this.

Due to the nature of Windows 8 and Microsoft's focus on tablets, I'm almost certain that we will see something like this in the near future. Steam could be a great platform for tablet styled games as well.

DarkLite123 · 09-17-2011, 04:39 AM

Quote:

Originally Posted by Aemony

Looks nice. In terms of a Metro UI interface for Steam, I really agree with something like this.

"Looking nice" is important for a UI, but it's not the sole factor. Usability is possibly the paramount criteria for a UI to be good. While these mockups may look nice, they don't match the current one in terms of keyboard/mouse usability. I fear that Metro is inherently weaker than other display methods for displaying large amounts of data, and I can't see any way around this limitation.

theyarecoming4u · 09-17-2011, 05:50 PM

Having tried the Windows 8 Developer Preview I too would like to see a Metro version of Steam, at least as an option. Valve did manage to integrate jumplist support for Win7, so it's not beyond the realms of possibility.

I also agree with the criticism of the Metro interface from a traditional PC perspective. Currently it switches in and out of Metro and Classic, which feels unnatural. I can imagine it working well on a tablet but it's got a way to go yet on the desktop.

Jagged Tooth · 09-17-2011, 05:59 PM

While those concept shots do really look quite nice. I'm not sure if Valve is going to design a new UI only for Windows 8.

Aemony · 09-18-2011, 12:11 AM

Quote:

Originally Posted by DarkLite123

"Looking nice" is important for a UI, but it's not the sole factor. Usability is possibly the paramount criteria for a UI to be good. While these mockups may look nice, they don't match the current one in terms of keyboard/mouse usability. I fear that Metro is inherently weaker than other display methods for displaying large amounts of data, and I can't see any way around this limitation.

I really couldn't care less. Metro UI is an UI focus solely on touch-based input and while it is usable with kb+m it doesn't really work well anywhere. If I was using Steam on my desktop I wouldn't care much about this UI mockup since it is obviously targeted towards tablet devices.

Mirosoft should stop trying to enforce the "one UI to rule them all" mantra and start dividing and catering to each individual device. Your post is a perfect example of why I'm not interested in Windows 8. It's just insane limiting interfaces potential simply because a designer must ensure it works well for two (or more) very different peripherals.

ChrisP · 09-19-2011, 03:56 PM

The problem at this point is we don't know what Microsoft is going to pull out of the bag over the next year. I do like the Metro UI, and it is usable with a mouse and keyboard for the most part, whether it's ideal remains to be seen. Regardless Microsoft seem very committed in bringing this UI to the masses.

Anyway, I've updated a number of screenshots in the original post so as you know. Also I've created a screen with what I would consider a toggle-able option for the main library screen; your wishlist! So you can see if the game you've been dying to play is on offer without any effort at all:

Library with Optional Wishlist Pane

09-15-2011, 04:52 PM	#1
ChrisP Join Date: Sep 2011 Reputation: 26 Posts: 12	Metro UI (...just bare with me! Screenshots enclosed!) If Windows 8's new UI turns out to be even slightly successful then it is a safe bet that monitors and computers generally will come with touch built-in, and so while not useful for gaming itself, a metro style Steam client application may become a real possibility some years down the line. To that end, as an enthusiast of UI and UX I decided to experiment with the concept of a Steam Metro UI. Please note that these shots (especially of the store) are very early WIP mockups. Home Page Home Page with App Bar Store (19.09.11) Store Product Page (17.09.11) Community Home Page with custom background from a users screenshots and the App Bar Early WIP Owned Game selected from library (17.09.11) Updated Store page showing AppBar with a genre menu (19.09.11) Library with Optional Wishlist Pane (19.09.11) WIP Owned Game selected from library with Community feed (19.02.12) Very Early WIP Owned Game selected from library with community feed + online friends (19.02.12) Obviously there are a number of design decisions that would have to be made, as well as lots of end-user testing for this to be a viable UI for steam, but for an experiment I think it's an interesting start and welcome constructive feedback! Non-Metro Steam UI Concepts: Steam Store Revision (Very Early WIP) - (older version) Last edited by ChrisP: 03-15-2012 at 05:53 PM. Reason: New screenshots

09-16-2011, 06:23 AM	#7
ChrisP Join Date: Sep 2011 Reputation: 26 Posts: 12	@cylon: I'd forgotten about that announcement! Microsoft have stated the Metro UI is just as good for a keyboard and mouse as for touch. Plus if you have a gamer who solely uses a controller, he could in theory do away with the mouse and keyboard. All that said and done, I have used Windows 8 and feel MS have a little way to go before their new UI is totally fit for kb/mouse so, like you, I remain sceptical! Still their UI is pretty sexy IMO! @Peewi: The screenshots I've posted are mostly photoshoped shots based on a Windows 8 app from the developer preview. I have started an app but so far look nowhere near that 'polished' yet, well essentially it's just a rough home screen so far!! Last edited by ChrisP: 09-16-2011 at 06:26 AM. Reason: Clarification

09-19-2011, 03:56 PM	#15
ChrisP Join Date: Sep 2011 Reputation: 26 Posts: 12	The problem at this point is we don't know what Microsoft is going to pull out of the bag over the next year. I do like the Metro UI, and it is usable with a mouse and keyboard for the most part, whether it's ideal remains to be seen. Regardless Microsoft seem very committed in bringing this UI to the masses. Anyway, I've updated a number of screenshots in the original post so as you know. Also I've created a screen with what I would consider a toggle-able option for the main library screen; your wishlist! So you can see if the game you've been dying to play is on offer without any effort at all: Library with Optional Wishlist Pane Last edited by ChrisP: 09-19-2011 at 03:59 PM.

Thread Tools
Show Printable Version Email this Page
Display Modes
Linear Mode Switch to Hybrid Mode Switch to Threaded Mode

09-16-2011, 04:47 AM	#3
ChrisP Join Date: Sep 2011 Reputation: 26 Posts: 12	Lol, I'm only new in terms of account creation, Still I had to write it! I've also started a store product page available here. Note there is a lot of clutter... I mean information on the actual steam store pages which I am still trying to work out how to present. I know it's unlikley such a UI will be implemented, Valve does tend to stick to their guns with regards to Steam as you say.

09-16-2011, 05:14 AM	#5
cylon Join Date: Nov 2009 Reputation: 740 Posts: 3,268	Touchscreen for tablets etc. Fine. No problem, seems to work well and it's what windows needs in order to make things easier. I've had a winmo phone with a touch screen and REALLY SMALL buttons that you need to stab with a fingernail to choose, i can see similar problems with tablets and this issue resolves it. BUT... for desktops, i can't really see much point - especially for Steam. You turn your PC on, reach across the desk - swipe into windows, tab into steam, swipe to the library, tap on the game.... then forget the screen and use the mouse and keyboard...? Unless your screen is right in your face, isn't it just going to be tiring sitting with your arms out reaching for the screen all evening? Mouse and keyboard, arms rested on the desk, click click click - sorted! Nice mock ups though :P

09-17-2011, 03:38 AM	#9
Gorge Join Date: Oct 2010 Reputation: 74 Posts: 139	i dont like the idea of a touchscreen and i dont like the idea of metro UI in steam. i think metro UI is the worst choice Microsoft have ever made. it looks terrible and they have just taken ideas from what works on phones and put it on the desktop. bad idea

09-17-2011, 04:18 AM	#10
Aemony Join Date: Jan 2010 Reputation: 1053 Posts: 3,920	Looks nice. In terms of a Metro UI interface for Steam, I really agree with something like this. Due to the nature of Windows 8 and Microsoft's focus on tablets, I'm almost certain that we will see something like this in the near future. Steam could be a great platform for tablet styled games as well.

09-17-2011, 05:50 PM	#12
theyarecoming4u Join Date: Dec 2004 Reputation: 69 Posts: 1,932	Having tried the Windows 8 Developer Preview I too would like to see a Metro version of Steam, at least as an option. Valve did manage to integrate jumplist support for Win7, so it's not beyond the realms of possibility. I also agree with the criticism of the Metro interface from a traditional PC perspective. Currently it switches in and out of Metro and Classic, which feels unnatural. I can imagine it working well on a tablet but it's got a way to go yet on the desktop.

09-17-2011, 05:59 PM	#13
Jagged Tooth Join Date: Aug 2005 Reputation: 1115 Posts: 3,111	While those concept shots do really look quite nice. I'm not sure if Valve is going to design a new UI only for Windows 8.