{"id":274,"date":"2025-05-16T10:29:09","date_gmt":"2025-05-16T10:29:09","guid":{"rendered":"https:\/\/saindesigns.nl\/?page_id=274"},"modified":"2025-08-02T11:46:12","modified_gmt":"2025-08-02T11:46:12","slug":"project-foodcourt","status":"publish","type":"page","link":"https:\/\/saindesigns.nl\/?page_id=274","title":{"rendered":"Project Foodcourt"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"274\" class=\"elementor elementor-274\">\n\t\t\t\t<div class=\"elementor-element elementor-element-65b0ff9 e-flex e-con-boxed e-con e-parent\" data-id=\"65b0ff9\" data-element_type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-8b23ae7 elementor-widget elementor-widget-heading\" data-id=\"8b23ae7\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Van begin tot eind - Project foodcourt<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-a707723 e-flex e-con-boxed e-con e-parent\" data-id=\"a707723\" data-element_type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-a350fd4 elementor-widget elementor-widget-heading\" data-id=\"a350fd4\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Wireframes - Foodcourt<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-80684bd e-flex e-con-boxed e-con e-parent\" data-id=\"80684bd\" data-element_type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-388c257 e-con-full e-flex e-con e-child\" data-id=\"388c257\" data-element_type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-9812ef5 elementor-widget elementor-widget-image\" data-id=\"9812ef5\" data-element_type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img fetchpriority=\"high\" decoding=\"async\" width=\"1024\" height=\"688\" src=\"https:\/\/saindesigns.nl\/wp-content\/uploads\/2025\/05\/wireframee2-1024x688.png\" class=\"attachment-large size-large wp-image-288\" alt=\"\" srcset=\"https:\/\/saindesigns.nl\/wp-content\/uploads\/2025\/05\/wireframee2-1024x688.png 1024w, https:\/\/saindesigns.nl\/wp-content\/uploads\/2025\/05\/wireframee2-300x201.png 300w, https:\/\/saindesigns.nl\/wp-content\/uploads\/2025\/05\/wireframee2-768x516.png 768w, https:\/\/saindesigns.nl\/wp-content\/uploads\/2025\/05\/wireframee2.png 1269w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-93f8de5 e-con-full e-flex e-con e-child\" data-id=\"93f8de5\" data-element_type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-63578b0 elementor-widget elementor-widget-image\" data-id=\"63578b0\" data-element_type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img decoding=\"async\" width=\"1024\" height=\"687\" src=\"https:\/\/saindesigns.nl\/wp-content\/uploads\/2025\/05\/wireframee1-1024x687.png\" class=\"attachment-large size-large wp-image-287\" alt=\"\" srcset=\"https:\/\/saindesigns.nl\/wp-content\/uploads\/2025\/05\/wireframee1-1024x687.png 1024w, https:\/\/saindesigns.nl\/wp-content\/uploads\/2025\/05\/wireframee1-300x201.png 300w, https:\/\/saindesigns.nl\/wp-content\/uploads\/2025\/05\/wireframee1-768x515.png 768w, https:\/\/saindesigns.nl\/wp-content\/uploads\/2025\/05\/wireframee1.png 1268w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-775643b e-con-full e-flex e-con e-child\" data-id=\"775643b\" data-element_type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-3ab71c3 elementor-widget elementor-widget-image\" data-id=\"3ab71c3\" data-element_type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img decoding=\"async\" width=\"1024\" height=\"723\" src=\"https:\/\/saindesigns.nl\/wp-content\/uploads\/2025\/05\/wireframee3-1024x723.png\" class=\"attachment-large size-large wp-image-289\" alt=\"\" srcset=\"https:\/\/saindesigns.nl\/wp-content\/uploads\/2025\/05\/wireframee3-1024x723.png 1024w, https:\/\/saindesigns.nl\/wp-content\/uploads\/2025\/05\/wireframee3-300x212.png 300w, https:\/\/saindesigns.nl\/wp-content\/uploads\/2025\/05\/wireframee3-768x542.png 768w, https:\/\/saindesigns.nl\/wp-content\/uploads\/2025\/05\/wireframee3.png 1189w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-cc43f23 e-flex e-con-boxed e-con e-parent\" data-id=\"cc43f23\" data-element_type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-3fc7382 elementor-widget elementor-widget-text-editor\" data-id=\"3fc7382\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p data-start=\"152\" data-end=\"453\"><strong data-start=\"152\" data-end=\"193\">Wireframes voor het project Foodcourt<\/strong><br data-start=\"193\" data-end=\"196\" \/>Voor het project <em data-start=\"213\" data-end=\"224\">Foodcourt<\/em> kregen we de opdracht om drie verschillende wireframes te maken. Het doel hiervan was om te experimenteren met verschillende lay-outs en stijlen, en te onderzoeken wat het beste zou werken voor de uiteindelijke app of website.<\/p><p data-start=\"455\" data-end=\"747\">Door meerdere ontwerpen te maken, kon ik testen welke elementen goed samenwerkten, of alles logisch geplaatst was, en waar eventueel ruimte was voor animaties of interactieve onderdelen. Deze wireframes hielpen mij om een beter beeld te krijgen van de gebruikerservaring en de visuele opbouw.<\/p><p data-start=\"749\" data-end=\"1025\">Hier zie je mijn drie schetsen. Uiteindelijk heb ik gekozen voor het derde en laatste ontwerp (de grootste afbeelding). Dit ontwerp sprak mij het meest aan omdat het het beste aansluit bij de sfeer van het project en omdat de indeling overzichtelijk en gebruiksvriendelijk is.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-3169ca2 e-flex e-con-boxed e-con e-parent\" data-id=\"3169ca2\" data-element_type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-02a9cbd e-con-full e-flex e-con e-child\" data-id=\"02a9cbd\" data-element_type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-956bdbb elementor-widget elementor-widget-heading\" data-id=\"956bdbb\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Micro interactie<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-ac825ce e-flex e-con-boxed e-con e-parent\" data-id=\"ac825ce\" data-element_type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-fdb2c5b elementor-widget elementor-widget-image\" data-id=\"fdb2c5b\" data-element_type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"720\" src=\"https:\/\/saindesigns.nl\/wp-content\/uploads\/2025\/05\/miecro-interactie-1024x720.png\" class=\"attachment-large size-large wp-image-293\" alt=\"\" srcset=\"https:\/\/saindesigns.nl\/wp-content\/uploads\/2025\/05\/miecro-interactie-1024x720.png 1024w, https:\/\/saindesigns.nl\/wp-content\/uploads\/2025\/05\/miecro-interactie-300x211.png 300w, https:\/\/saindesigns.nl\/wp-content\/uploads\/2025\/05\/miecro-interactie-768x540.png 768w, https:\/\/saindesigns.nl\/wp-content\/uploads\/2025\/05\/miecro-interactie.png 1121w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-e7c9677 e-flex e-con-boxed e-con e-parent\" data-id=\"e7c9677\" data-element_type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-dd09427 elementor-widget elementor-widget-text-editor\" data-id=\"dd09427\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p data-start=\"158\" data-end=\"498\"><strong data-start=\"158\" data-end=\"206\">Micro-interactie voor de Foodcourt Figma-app<\/strong><br data-start=\"206\" data-end=\"209\" \/>Voor deze opdracht moesten we een micro-interactie ontwerpen en voorbereiden voor onze Foodcourt-app in Figma. Het doel van een micro-interactie is om de gebruikerservaring te verbeteren door middel van kleine, subtiele animaties die de interface levendiger en gebruiksvriendelijker maken.<\/p><p data-start=\"500\" data-end=\"577\">Uiteindelijk heb ik ervoor gekozen om twee micro-interacties toe te voegen:<\/p><ol data-start=\"578\" data-end=\"1125\"><li data-start=\"578\" data-end=\"777\"><p data-start=\"581\" data-end=\"777\"><strong data-start=\"581\" data-end=\"620\">Ingredi\u00ebnten vergroten bij selectie<\/strong> \u2013 Wanneer je een ingredi\u00ebnt selecteert, wordt deze iets groter. Dit geeft directe visuele feedback en maakt het duidelijk welke keuzes de gebruiker maakt.<\/p><\/li><li data-start=\"778\" data-end=\"1125\"><p data-start=\"781\" data-end=\"1125\"><strong data-start=\"781\" data-end=\"815\">Glinsterend logo bij opstarten<\/strong> \u2013 Het startlogo van de app laat ik kort glimmen wanneer de app wordt geopend. Het idee hierachter is om de aandacht van de gebruiker te trekken en een gevoel van interesse en nieuwsgierigheid op te wekken. Hierdoor wordt de gebruiker op een subtiele manier gestimuleerd om verder te gaan met het bestelproces.<\/p><\/li><\/ol><p data-start=\"1127\" data-end=\"1254\">Deze kleine animaties dragen bij aan een aantrekkelijker en interactiever ontwerp, zonder dat ze de gebruikservaring verstoren.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-4ea71b4 e-flex e-con-boxed e-con e-parent\" data-id=\"4ea71b4\" data-element_type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-c6e5ab1 elementor-widget elementor-widget-heading\" data-id=\"c6e5ab1\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Styleboard<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-2882b07 e-flex e-con-boxed e-con e-parent\" data-id=\"2882b07\" data-element_type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-7915901 elementor-widget elementor-widget-image\" data-id=\"7915901\" data-element_type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"720\" src=\"https:\/\/saindesigns.nl\/wp-content\/uploads\/2025\/05\/styleboard-1024x720.png\" class=\"attachment-large size-large wp-image-297\" alt=\"\" srcset=\"https:\/\/saindesigns.nl\/wp-content\/uploads\/2025\/05\/styleboard-1024x720.png 1024w, https:\/\/saindesigns.nl\/wp-content\/uploads\/2025\/05\/styleboard-300x211.png 300w, https:\/\/saindesigns.nl\/wp-content\/uploads\/2025\/05\/styleboard-768x540.png 768w, https:\/\/saindesigns.nl\/wp-content\/uploads\/2025\/05\/styleboard.png 1190w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-fe4bec3 e-flex e-con-boxed e-con e-parent\" data-id=\"fe4bec3\" data-element_type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-b1d3021 elementor-widget elementor-widget-text-editor\" data-id=\"b1d3021\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p data-start=\"113\" data-end=\"483\"><strong data-start=\"113\" data-end=\"154\">Styleboard voor het Foodcourt-project<\/strong><br data-start=\"154\" data-end=\"157\" \/>Dit is mijn styleboard voor het <em data-start=\"189\" data-end=\"200\">Foodcourt<\/em>-project. Hierin zie je in principe alle visuele elementen die ik in mijn app heb gebruikt. Denk hierbij aan de kleuren, typografie, iconen, illustraties en algemene vormgeving. Het styleboard geeft een duidelijk overzicht van de sfeer en stijl die ik in het ontwerp wil overbrengen.<\/p><p data-start=\"485\" data-end=\"682\">De onderdelen zoals de app-layout en het algemene design zijn hier al zichtbaar, met uitzondering van de interactieve elementen zoals de knoppen. Deze zijn apart verder uitgewerkt in de app zelf.<\/p><p data-start=\"684\" data-end=\"832\">Het styleboard dient als visuele leidraad tijdens het ontwerpproces en zorgt ervoor dat alles consistent blijft qua uitstraling en gebruikservaring.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-13c25a9 e-flex e-con-boxed e-con e-parent\" data-id=\"13c25a9\" data-element_type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-82795d9 elementor-widget elementor-widget-video\" data-id=\"82795d9\" data-element_type=\"widget\" data-settings=\"{&quot;youtube_url&quot;:&quot;https:\\\/\\\/youtu.be\\\/y7x2XgC4Zvs&quot;,&quot;video_type&quot;:&quot;youtube&quot;,&quot;controls&quot;:&quot;yes&quot;}\" data-widget_type=\"video.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-wrapper elementor-open-inline\">\n\t\t\t<div class=\"elementor-video\"><\/div>\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Van begin tot eind &#8211; Project foodcourt Wireframes &#8211; Foodcourt Wireframes voor het project FoodcourtVoor het project Foodcourt kregen we de opdracht om drie verschillende wireframes te maken. Het doel hiervan was om te experimenteren met verschillende lay-outs en stijlen, en te onderzoeken wat het beste zou werken voor de uiteindelijke app of website. Door meerdere ontwerpen te maken, kon ik testen welke elementen goed samenwerkten, of alles logisch geplaatst was, en waar eventueel ruimte was voor animaties of interactieve onderdelen. Deze wireframes hielpen mij om een beter beeld te krijgen van de gebruikerservaring en de visuele opbouw. Hier zie<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-274","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/saindesigns.nl\/index.php?rest_route=\/wp\/v2\/pages\/274","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/saindesigns.nl\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/saindesigns.nl\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/saindesigns.nl\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/saindesigns.nl\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=274"}],"version-history":[{"count":52,"href":"https:\/\/saindesigns.nl\/index.php?rest_route=\/wp\/v2\/pages\/274\/revisions"}],"predecessor-version":[{"id":454,"href":"https:\/\/saindesigns.nl\/index.php?rest_route=\/wp\/v2\/pages\/274\/revisions\/454"}],"wp:attachment":[{"href":"https:\/\/saindesigns.nl\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=274"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}