Ohmyfood

Link to website
Link to project repo
Project Gallery

1/4

Github
HTML5
SaSS

Ohmyfood est une société de commande de repas en ligne. Leur concept permet aux utilisateurs de composer leur propre menu et de réduire leur temps d'attente dans les restaurants, car leur menu est préparé à l'avance. Plus de temps perdu à regarder le menu. Ils veulent offrir à leurs clients les menus des restaurants gastronomiques. Initialement développés à New York, ils souhaitent désormais étendre leur concept à la capitale de la gastronomie : Paris. Ils se positionnent sur un marché de niche, auprès des restaurants de luxe des villes dans lesquelles ils sont implantés. Ils souhaitent être identifiés comme une entreprise offrant des services hauts de gammes aux classes moyennes et supérieures, connectées et souvent pressées, désireuses de déguster des produits de qualité.

Fonctionnalités

  • Un spinner de chargement pour quand l'application a plus de menus.
  • Une section contenant 4 menus sous forme de carte. En cliquant dessus, l'utilisateur est redirigé vers le menu.
  • En arrivant sur une page de menu, les plats doivent apparaître progressivement avec un léger décalage.
  • Au survol, une petite coche doit apparaître à droite pour simuler le choix d'un plat par le visiteur.
  • Au survol, la couleur de fond des boutons principaux s'illumine légèrement et l'ombre portée devient plus visible.
  • Un bouton 'J'aime' en forme de cœur, au survol, il se remplit progressivement. (simule un visiteur qui enregistre ses menus préférés).

Contraintes

  • Maquettes fournies.
  • Le développement doit se faire en CSS, sans JavaScript.
  • Aucun Framework ne doit être utilisé, cependant l'utilisation de SASS serait un plus.
  • Aucun code CSS ne doit être appliqué via un attribut de style dans une balise HTML.
  • L'ensemble du site doit être responsive sur mobile, tablette et desktop.
  • Les pages doivent passer la validation W3C en HTML et CSS sans erreur.
  • Le site doit être compatible avec les dernières versions de Chrome et de Firefox.

Compétences

  • Assurer la cohérence graphique d'un site web
  • Utiliser un système de gestion de versions pour le suivi du projet et son hébergement
  • Mettre en œuvre des effets CSS graphiques avancés
  • Mettre en place son environnement Front-End
  • Mettre en place une structure de navigation pour un site web