Recipe websites, data modeling, and user experience

Simeon Griggs with some nice UX ideas for a recipe website:

  • No math. Swap between units and adjust servings on-the-fly.
  • Offer alternative ingredients.
  • Re-list the ingredient amounts when they’re referenced in the instructions.

I totally agree, especially on that last …


The post Recipe websites, data modeling, and user experience appeared first on CSS-Tricks.

You can support CSS-Tricks by being an MVP Supporter.


This content originally appeared on CSS-Tricks and was authored by Chris Coyier

Simeon Griggs with some nice UX ideas for a recipe website:

  • No math. Swap between units and adjust servings on-the-fly.
  • Offer alternative ingredients.
  • Re-list the ingredient amounts when they’re referenced in the instructions.

I totally agree, especially on that last one:

Of all our improvements I think this is my favourite.

A typical recipe layout contains ingredients with amounts at the start. Then, a bullet point list of instructions to perform the method.

The method though typically does not reference those amounts again, so if you don’t prepare all your amounts ahead of time (which is what you’re probably supposed to do but come on who does that) you’ll have to keep scanning back and forward.

Part of what makes this stuff possible is how you set up the data model. For example, an ingredient might be an Array instead of a String so that you’re set up for offering alternatives right out of the gate.

Direct Link to ArticlePermalink


The post Recipe websites, data modeling, and user experience appeared first on CSS-Tricks.

You can support CSS-Tricks by being an MVP Supporter.


This content originally appeared on CSS-Tricks and was authored by Chris Coyier


Print Share Comment Cite Upload Translate Updates
APA

Chris Coyier | Sciencx (2021-02-18T21:19:54+00:00) Recipe websites, data modeling, and user experience. Retrieved from https://www.scien.cx/2021/02/18/recipe-websites-data-modeling-and-user-experience/

MLA
" » Recipe websites, data modeling, and user experience." Chris Coyier | Sciencx - Thursday February 18, 2021, https://www.scien.cx/2021/02/18/recipe-websites-data-modeling-and-user-experience/
HARVARD
Chris Coyier | Sciencx Thursday February 18, 2021 » Recipe websites, data modeling, and user experience., viewed ,<https://www.scien.cx/2021/02/18/recipe-websites-data-modeling-and-user-experience/>
VANCOUVER
Chris Coyier | Sciencx - » Recipe websites, data modeling, and user experience. [Internet]. [Accessed ]. Available from: https://www.scien.cx/2021/02/18/recipe-websites-data-modeling-and-user-experience/
CHICAGO
" » Recipe websites, data modeling, and user experience." Chris Coyier | Sciencx - Accessed . https://www.scien.cx/2021/02/18/recipe-websites-data-modeling-and-user-experience/
IEEE
" » Recipe websites, data modeling, and user experience." Chris Coyier | Sciencx [Online]. Available: https://www.scien.cx/2021/02/18/recipe-websites-data-modeling-and-user-experience/. [Accessed: ]
rf:citation
» Recipe websites, data modeling, and user experience | Chris Coyier | Sciencx | https://www.scien.cx/2021/02/18/recipe-websites-data-modeling-and-user-experience/ |

Please log in to upload a file.




There are no updates yet.
Click the Upload button above to add an update.

You must be logged in to translate posts. Please log in or register.