On Tue, 2009-07-07 at 01:20 -0700, David McLeod wrote: > > > Comments inline... > > On 6 Jul 2009, at 18:21, Kevin Fox wrote: > > > On Fri, 2009-07-03 at 01:40 -0700, David McLeod wrote: > > > > > > So, how about something different today?... > > > > > > > > > First thing to do is to download this thumbnail sketch I did > > > quickly > > > this morning before going any further: > > > http://people.fluendo.com/dmcleod/epd_thumbnail.pdf > > > > Looks good. > > > > > What I want to do is explain some of the issues with UI design and > > > interaction. > > > So check out the image now...and everything in light blue pen is > > > where > > > I label what the crude little doodles are :) > > > Everything in orange I will use to explain some interaction > > > issues. > > > > K. > > > > > This is an insight into how I work, I quickly go through basic > > > conceptual problems with little crappy thumbnails that usually > > > only I > > > can understand :). This allows me to work fast and get an overview > > > of > > > the problems I might face. Later on, I might sketch on specific > > > parts > > > of it or focus sketches on a particular use case (across multiple > > > thumbnails usually)... then I might produce a 'comp' which is kind > > > of > > > a more detailed thumbnail either drawn or loosely produced in > > > Phtooshop. Then when I feel I have it all solved... only then do I > > > make a full proper visual. I do these full visuals pixel perfect > > > as > > > well which is a lot of time upfront but it means less confusion > > > later > > > on. (sometimes I show buttons states or pull out new unique > > > elements > > > and document the interaction of those seperately with more > > > focus... > > > again pixel perfect). > > > > > > > > > Note: I always only ever consider the remote control when > > > designing > > > for Moovida. > > > The order of priority for anything we do here goes: Remote, > > > Keyboard, Mouse, Touchscreen. It has to work with the remote > > > (Apple remote is our default of choosing currently), anything else > > > is just a bonus. > > > > > > > Since a six button remote is very confining in what it can do, that > > order of operations makes sense. > > > > > > > So, what am I tackling here? > > > > > > > > > I am looking at the Full EPG, and thinking about how it would fit > > > into > > > Moovida. > > > So I have considered each TV station would have a visual > > > thumbnail, > > > each station has a row that has their upcoming shows listed on a > > > horizontal timeline. > > > You go up and down to access each TV stations timeline... left and > > > right to browse along the upcoming shows within it. > > > > > > > > > So, what problems do I immediately see? > > > > > > > > > Well, considering that Moovida uses an opacity technique to tell > > > the > > > user that additional things (e.g. bars of a list) can be scrolled > > > to, > > > I am not sure how to do this with an EPG guide like this. > > > If you are a visual person you might understand what I mean. > > > How do I do opacity changes on the 'grey bars' we use when they > > > move > > > to the left of the screen and tuck under the TV station logos? > > > Those bars are going to be different lengths to represent > > > different > > > lengths of the TV shows...then we need to do the same technique > > > for > > > the right of the screen. > > > Instinctively, I know this is going to look visually weird... but > > > maybe, I might be able to solve this in Photoshop or by testing > > > out > > > some 'comps' to get this worked out...so for now I will continue. > > > > I think you just need to place enough space between the left edge of > > the > > channel name and the right edge of the currently selected time. If > > you > > really want to make that space small, maybe add an arrow in that > > spot, > > or by the "Time" header. showing there is more stuff there. > > > > > If only it were actually that simple :) > Plus, as a rule... no arrows in Moovida... takes up wasted space. > Thats why opacity is used to suggest 'more'... the list items roll off > the bottom and top edges through opacity.
If the opacity clue with a small sliver is not enough to hint that there is more though, then an arrow may not be a waste of space. But, I'll leave that up to you. I think the opacity clue will probably work ok. > > > > > > > > Next problem, I read in a previous email that some like the Now & > > > Next > > > guide vs the Full EPG...ok, one idea was to use the 'view option' > > > buttons we have top right in Moovida to toggle between the two. > > > BUT, > > > how can I do that with such a limited navigation concept and > > > limited > > > buttons on the remote? > > > > > > > > > Let me explain... (check out the orange arrows on the thumbnail > > > sketch) I go up and down TV stations (imagine there are 100 or > > > so), so > > > that means the up and down buttons are taken... then I go left and > > > right through the 'timeline'... that means the left and right > > > buttons > > > are taken. So, I have a problem now... I can navigate up to those > > > buttons so the user can switch between the views! > > > > > > > > > I suppose I could be mean to the user and say, sorry, if you are > > > at > > > channel 100, you just got to keep scrolling until you get to the > > > top > > > most channel...then press up again... and you can now change > > > views. That however, is not user friendly, and shows the user no > > > compassion for their problem. > > > > > > > > > So, what is the solution to this? Well, continue to brainstorm on > > > this, test out some ideas, figure out some creative visual problem > > > solving but, keep my mind open to other possibilities... next > > > email, I > > > have a different idea :). > > > > The timeline is rooted at 'NOW()' on the left. Nothing exists to the > > left of now. So, most of the time you want to switch the views you > > will > > be at 'NOW()' anyway, or are within one 'left' keypress. So, I'd > > make > > the 'left' key press when on 'NOW()' move up to the selector. That > > makes > > it fairly easy to get to from a 6 button. > > > > > Yeah, you cant think like that though. Not totally. > As a rule you cannot allow a user to 'get stuck' in any UI and then > argue your way out of it. (dont get me wrong, I agree with your > presumption though in part) > The user in the Full EPG, at the moment with current thinking could go > forward one whole week and get 'stuck'... only way out of it is a good > amount of button presses. > You shouldn't do things like that to the user. A coworker had a good idea on this one. If you are far out into the future on the EPG, there is probably a few actions you might want to do here, "go back to now()" or "switch epg modes" or "exit epg". The Back button could pop up a menu asking you which one you wanted. Kevin > > > > > Kevin > > > > > > > > > > > > > > > > > > > > David McLeod > > > Senior Designer & UI Lead > > > > > > > > > > > > > > > Fluendo S.A. > > > World Trade Center Edificio Norte Pl.2 > > > 08039 BARCELONA SPAIN > > > Tel: +34 936 002 323 > > > > > > > > > Skype: Daiode > > > Jabber/GMail: [email protected] > > > Email: [email protected] > > > > > > > > > > > > > > > > > > > > > > > > > > > > > David McLeod > Senior Designer & UI Lead > > > > > Fluendo S.A. > World Trade Center Edificio Norte Pl.2 > 08039 BARCELONA SPAIN > Tel: +34 936 002 323 > > > Skype: Daiode > Jabber/GMail: [email protected] > Email: [email protected] > > > > > > > > > >
