[Fofredux-devel] Usability

[Khaled A. A. <kha...@gm...>]

Hey all,

As I've been using the last design for a couple of days now I've had
some time to truly appreciate all the ins and outs of the new interface
and I just want to post some thoughts that I'd like to see if we can
implement them for the upcoming 0.4 release. I've separated things into
design and usability so that we can discuss the usability issues more.

Regarding the design issues, we're honestly nearly there which is
absolutely amazing. The points I've made are just tweaks here and there
to tighten everything up really.

I will sort out the icons and send them later on this evening as well.


Usability 1:
1.1 When you login you're in the Frame View rather than the admin
section - We've discussed this before just putting it down on the list
effectively)

1.2 When you hover over one of the feed items in the list of feed names
on the left hand side should change to a light blue colour. This
effectively tells the user exactly where they are. It's a great visual
aid that makes things simpler to use. 

I know how to do this if it's a list however I'm finding it a bit
difficult getting that effect with the current code. Any ideas?

1.3 Getting rid of the frame borders. Now I have personally gotten rid
of them on my install. Of course the problem with this however is that
you don't have the flexibility to change the sizes as you please. I
understand this isn't great, however what's good is that even for really
large feed names they wrap around so even if we did fix the width I
don't think it would render things unusable or anything like that, just
not as flexible. Thoughts? 

1.4 I was thinking that it would great if when you click refresh views
the screen goes dark and an animation starts as a visual indicator to
the user that things are happily going along in the background (for an
example check my site, under www.brokenkode.com/illustration


Design 2 - This is mainly to have a list of things that we need to sort
out so please add as you see more items that I might have missed:
2.1 The login page shouldn't have both header and footer with the FOFR
logo. Should be just the top one. 

2.2 Logo to be aligned with the words login, password and forgot your
password?

2.3 The line above 'Forgot Password' should be png with white and dark
grey rather than black line.

2.4 The header frame should be a set value rather than a percentage. On
smaller screens this seems to get smaller and cuts off some of the other
options, such as view new items etc. Mockups show this at 62px.

2.5 Main navigation (ie feeds, category, tags, flag) should align with
the text in the feeds list.

2.6 # new items - should show the total number of new items.

2.7 Inclusion of Favicons and the default when there is no favicon
available

2.8 Secondary navigation (view new items, view saved items) should be on
the right hand side).

2.9 Mark as read should be moved from the entire feed list (ie you mark
an entire website with all it's feeds as read) and moved to the
individual items so that they can be marked as read as individual items.
Option in the right hand frame to mark all the items in that particular
website feed as read (located in the frame's navigation).

2.10 Greys in the feed reader itself is slightly too dark. The greys
should be as follows:

Darkest Grey: #383838
Dark Grey: #565656
Light Grey: #f8f8f8
Medium Grey: #e5e5e5

First two are fine, just need to sort out the bottom two.

2.11 Icons for the arrows for the elements for marking items read in the
frame navigation.

2.12 Bottom frame with FOFRedux footer to be added to all the way
through. Currently this is not present in the Framed View. Also in the
admin section the FOFRedux footer is shown at the bottom of the page in
the middle of the actual page. 

2.13 Add feed section to be aligned with the rest of the actual page
elements on the left hand side so that they go down in a straight line.

2.14 Feed name, banner to be outside the darkest grey bar. Also the
categories bar apart from the first do not show up.

2.15 Lines under the Add Feed and a new Edit Feed header to be added to
the admin section to distinguish between the two sections.



Khaled Abou Alfa
www.brokenkode.com