Loopion

A week ago I had for mission to create a form for shops, you know the famous…

How to let user input properly those informations via a form?

That’s what I study 2 weeks ago. Searching an easy way to let user input their opening hours schedule without getting in a long and boring form to fill. This task was just in time after I finished reading Web Form Design: Filling in the Blanks written by Luke Wroblewski, an interesting book dissecting everything about web forms, users oriented design and business deal with forms. Of course I could only recommend you this book if you want to be a Jedi of form design.

So, to get information about schedule form design I searched arround the web where some of those form could exists. Answer: mostly on restaurants, events, shops websites and others… But after finding some redundant and un-userfriendly forms for filling this type of form, I decide to turn myself to software where schedule was applied.

What are the coverage?

By coverage, I mean that you can cover those rules

• Have all hours available: you can have seasonable work like a farmer who open his shop at 4am (bakery)
• Get range of date associated to those schedule: “Shop is opened from March to the end of August at 4am to 6pm and from September to February at 7am to 12am and 2pm to 9pm”
• Close your shop
• Be accessible in XHTML

After 30 minutes of search, I prototyped 3 types of schedule forms:

Classical schedule web form

Classical schedule web form prototype

What’s cool?

• XHTML accessibility
• Clear for novice and doesn’t really need explanation
• Simple to develop

What’s sucking around?

• Not enough visual & interactiveness
• Can’t add lunch time
• Boring to fill in the form

As a calendar view

Prototyping of a schedule form as a calendar view

What’s cool?

• You can specify a range of period
• Full coverage of opening hours by adding time blocks
• Clear for novice because it is similar to what they daily use

What’s sucking around?

• Rocket surgery to develop and maintain
• Long to fill for user
• Exhaustiveness of effort for getting it accesible

Table schedule selector

Schedule table selector prototyping

What’s cool?

• XHTML accessibility
• Clear for novice
• Speedy fill by just highlighting opening hours
• Lunch time is possible

What’s sucking around?

• No date range attribution

Conclusion

So which one should I use? As Luke would say: “It depends!” (I hate when he say this). To start in your reflexion, do you really need date range attribution? If yes, the calendar view is for you, but you can also implement a range selector for the table schedule selector or the classical schedule web form.
Then you’ll need to discuss about your audience. Will your audience understand how works your schedule form? Will it fit to my localization constraint (week starting on monday or sunday)? Do accessibility matter (sure it matter!)? Then questions about space is coming. Should I need vertical or horizontal display of the schedule? Finally and not the less important, time/cost to implement this kind of functionality.

Did you designed a schedule form? Have you work on some complicated schedule form? What’s your opinion all about that?