Editable fields WAS Date widget

Jonathan Hung jonathan.hung at utoronto.ca
Mon Jan 7 16:37:44 UTC 2008

Hi Daphne,

I think these wireframes are great. The last wireframe is a little
confusing. I understand it's like a toggle, but it's hard to tell because
the edit icon doesn't look like a toggle. Nit-picking I know, but adding an
icon that looks like a toggle can change / clutter an otherwise clean
looking interface.

Just thought I'd add my thoughts to in-line editing.

On Flickr, fields which are editable highlight yellow and the mouse
indicator turns from a pointer to a text cursor. Also, depending on the
field, an "Edit Text" tool tip pops up. (So three simultaneous indications
to denote an editable field). But the trick is the user needs to position
their mouse over the field, otherwise there's no visual indication to lead
them there.

In Adobe Acrobat Reader, if a document has an editable field, sometimes the
only affordance is that the mouse pointer changes from hand / gripper to a
text cursor. It's really easy to miss if you're not actively focused on the
mouse location though.

- Jon.

On 04/01/2008, Daphne Ogle <daphne at media.berkeley.edu> wrote:
> I sent this wireframe out yesterday but when I got it back from the list
> the message wasn't there so let me try again.
> The first 3 show rollover for different types of editable fields.  The
> last is an explicit click on the edit icon.  I didn't user highlighting
> because of the confusion it might cause with the other ways we use
> highlighting in Sakai.
> Thoughts?
> -Daphne
> On Jan 4, 2008, at 2:29 AM, Raad Al-Rawi wrote:
> On Jan 3, 2008, at 6:31 AM, John Norman wrote:
> Google Calendar works well for this situation (once you work out
> how it works :-) ). It displays brief date information - apparently
> as normal html - but when you click on the date info it becomes
> fully editable year, day and time. The usability challenge for me
> was that at first I didn't realise the date was editable. After
> thinking "how could Google write something so badly" for a while, I
> clicked on the date out of frustration and behold, the editable
> interface was revealed unto me. With the help of an edit icon
> (pencil) I would probably have got there sooner, but now I know how
> it works I like it.
> On 03 January 2008 at 19:10, Daphne Ogle wrote:
> My favorite approach right now is to highlight on rollover.   This
> interaction could be quickly learned.  However, we currently use
> highlighting in other ways:  1) to show what's new, 2) row stripping
> to separate information.   Is rollover highlighting different enough
> from these other visual indicators to not confuse users?
> Does Google listen in on the sakai-dg-ui list?!?
> I had a go with Google Calendar and I noticed that rollover highlighting
> is
> implemented for event metadata that is editable (What, When, and
> Description). It might give better indication of "editability" if it used
> a
> title tooltip or displayed some text somewhere when rolling over (say,
> "click to edit").
> I noticed that Google don't use any alt text or title text, so they are
> missing out on this type of UI/usability feature (not to mention better
> accessibility).
> Raad
> ----------------------
> This automatic notification message was sent by Sakai Collab (
> https://collab.sakaiproject.org/portal) from the DG: User Interaction
> site.
> You can modify how you receive notifications at My Workspace >
> Preferences.
> Daphne Ogle
> Senior Interaction Designer
> University of California, Berkeley
> Educational Technology Services
> daphne at media.berkeley.edu
> cell (510)847-0308
> _______________________________________________
> fluid-work mailing list
> fluid-work at fluidproject.org
> http://fluidproject.org/mailman/listinfo/fluid-work

Jonathan Hung / jonathan.hung at utoronto.ca
University of Toronto - ATRC
Tel: (416) 946-3002
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <https://lists.idrc.ocad.ca/pipermail/fluid-work/attachments/20080107/0428eedd/attachment.htm>
-------------- next part --------------
A non-text attachment was scrubbed...
Name: editible
Type: image/jpeg
Size: 53883 bytes
Desc: not available
URL: <https://lists.idrc.ocad.ca/pipermail/fluid-work/attachments/20080107/0428eedd/attachment.jpe>

More information about the fluid-work mailing list