{"id":612,"date":"2022-02-07T15:04:44","date_gmt":"2022-02-07T15:04:44","guid":{"rendered":"http:\/\/ematkiewicz.com\/?page_id=612"},"modified":"2022-02-07T15:13:04","modified_gmt":"2022-02-07T15:13:04","slug":"no-plastic-food","status":"publish","type":"page","link":"http:\/\/ematkiewicz.com\/index.php\/no-plastic-food\/","title":{"rendered":"No Plastic Food"},"content":{"rendered":"\n<div class=\"wp-block-columns alignwide is-layout-flex wp-container-core-columns-is-layout-8f761849 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<p class=\"wp-block-paragraph\">2022<br>UX\/UI Project<br>Final assignment for the Graphic Design course<br>Project duration: 1 month<\/p>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<p class=\"wp-block-paragraph\">Team<br><strong>Elizabeth Matkiewicz<\/strong><\/p>\n<\/div>\n<\/div>\n\n\n\n<div style=\"height:1px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<div class=\"wp-block-columns alignwide is-layout-flex wp-container-core-columns-is-layout-8f761849 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<div style=\"height:13px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"728\" src=\"http:\/\/ematkiewicz.com\/wp-content\/uploads\/2022\/02\/Website-Matkevits-1024x728.jpg\" alt=\"\" class=\"wp-image-619\" srcset=\"http:\/\/ematkiewicz.com\/wp-content\/uploads\/2022\/02\/Website-Matkevits-1024x728.jpg 1024w, http:\/\/ematkiewicz.com\/wp-content\/uploads\/2022\/02\/Website-Matkevits-300x213.jpg 300w, http:\/\/ematkiewicz.com\/wp-content\/uploads\/2022\/02\/Website-Matkevits-768x546.jpg 768w, http:\/\/ematkiewicz.com\/wp-content\/uploads\/2022\/02\/Website-Matkevits-scaled.jpg 2560w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<h2 class=\"wp-block-heading\" id=\"project-description\">Project Description<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">This is a UX\/UI project for the final assignment in Graphic Design and Typography I course at Linn\u00e6us University: \"A website enabling the public to take action against plastic manufacturers\". The project is for a made-up association of lawyers, politicians, and the public fighting for policies in Europe to ban single-use plastic used in\/for food wrapping and make production companies responsible for sustainable packaging and recycling. <\/p>\n\n\n\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-8f761849 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<h3 class=\"wp-block-heading\" id=\"TIE_3\">My Role<\/h3>\n\n\n\n<ul class=\"wp-block-list\"><li>Logo design<\/li><li>Basic branding<\/li><li>Copywriting<\/li><li>Prototyping in InDesign<\/li><\/ul>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<h3 class=\"has-text-align-left wp-block-heading\" id=\"TIE_4\">What I learned<\/h3>\n\n\n\n<ul class=\"wp-block-list\"><li>UI<\/li><\/ul>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n\n\n\n<div style=\"height:35px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h2 class=\"alignfull has-text-align-center wp-block-heading\" id=\"the-process\">The Process<\/h2>\n\n\n\n<div style=\"height:35px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<figure class=\"wp-block-image alignwide size-full is-style-default\"><img loading=\"lazy\" decoding=\"async\" width=\"8006\" height=\"4506\" src=\"http:\/\/ematkiewicz.com\/wp-content\/uploads\/2022\/02\/NoPlasticFoodTimeline.png\" alt=\"\" class=\"wp-image-652\" srcset=\"http:\/\/ematkiewicz.com\/wp-content\/uploads\/2022\/02\/NoPlasticFoodTimeline.png 8006w, http:\/\/ematkiewicz.com\/wp-content\/uploads\/2022\/02\/NoPlasticFoodTimeline-300x169.png 300w, http:\/\/ematkiewicz.com\/wp-content\/uploads\/2022\/02\/NoPlasticFoodTimeline-1024x576.png 1024w, http:\/\/ematkiewicz.com\/wp-content\/uploads\/2022\/02\/NoPlasticFoodTimeline-768x432.png 768w\" sizes=\"auto, (max-width: 8006px) 100vw, 8006px\" \/><\/figure>\n\n\n\n<div style=\"height:35px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<div class=\"wp-block-columns alignwide is-layout-flex wp-container-core-columns-is-layout-8f761849 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<h3 class=\"wp-block-heading\" id=\"TIE_6\">Research Question<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">\u201cHow can I create a website for an association fighting for an environmental cause that is different from similar organizations as well as captures visitors' attention and desire to join the cause?\u201d<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"TIE_8\">Tools<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Photoshop, InDesign, Illustrator, Unsplash<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"TIE_8\">Target Group<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">People interested in fighting against single-use plastic used in\/for food wrapping<\/p>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<h3 class=\"wp-block-heading\" id=\"TIE_7\">Problem<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Plastic is everywhere, yet so needed change is delayed. There are plenty of organizations fighting against plastic use, however, it feels like they are often overlooked. For the imaginary association called No Plastic Food, I wanted to create a website that would stand out from many similar causes, a website that would make the visitor feel something and fuel the desire to join the cause. <\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"TIE_9\">Methods<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Early exploration consisted of research through visual materials, literature research, and analysis of similar organizations. This data was analyzed and synthesized, converted into texts, and then used during prototyping.<br>After the analysis and synthesis, website prototyping was done in InDesign.<\/p>\n<\/div>\n<\/div>\n\n\n\n\n\n<h3 class=\"alignwide wp-block-heading\" id=\"TIE_10\">Research Phase<\/h3>\n\n\n\n<div class=\"wp-block-columns alignwide is-layout-flex wp-container-core-columns-is-layout-8f761849 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<p class=\"wp-block-paragraph\">Research through visual materials gave quick and deeper insights into a problem. Through carefully curated storytelling used in documentary films about plastic waste, the problem was explained with comprehensible language and showed the tragedy of the whole situation. The documentaries made me feel a lot of emotions as well as the desire to act now - this is something I wanted to include in my design.<\/p>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<p class=\"wp-block-paragraph\">Quick literature research gave me needed insights into writing texts for the homepage of the website and an overview of the current similar organizations.  I compared existing websites and narrowed down some similarities and differences when it came to an overall view of the website as well as the content. It helped to shape the main contents of the homepage as well as a direction where the design should move. However, the topic of plastic remained broad.<\/p>\n<\/div>\n<\/div>\n\n\n\n\n\n<h3 class=\"alignwide wp-block-heading\" id=\"TIE_10\">Prototyping<\/h3>\n\n\n\n<div class=\"wp-block-columns alignwide is-layout-flex wp-container-core-columns-is-layout-8f761849 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<p class=\"wp-block-paragraph\">Early prototyping began with sketching to put down all the ideas for what should be on the homepage as well as how it might look. The most important pieces of information I deemed valuable and desired were: \"What?\" \"Who?\" \"How?\"  I wanted the visitor to get as much information about the association as possible while avoiding informational overload. Once basic paper sketches were done and content determined, I moved to InDesign to try out different layouts and solutions.<\/p>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<p class=\"wp-block-paragraph\">The first prototypes were presented to potential users to test whether the design conveyed what I aspired. Getting feedback simply consisting of the word \"boring\" was definitely a wake-up call to change things. I decided that my design should be bold, striking, and evoke more feelings. I wanted the visitor to feel that the matter is concerning them personally as well. I narrowed down the topic to food and started searching for images to create my final visual. <\/p>\n<\/div>\n<\/div>\n\n\n\n<div style=\"height:47px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h2 class=\"alignwide wp-block-heading\" id=\"TIE_10\">Final Prototype<\/h2>\n\n\n\n<div class=\"wp-block-columns alignwide is-layout-flex wp-container-core-columns-is-layout-8f761849 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<p class=\"wp-block-paragraph\">The final version of the homepage for an imaginary association No Plastic Food was made in InDesign and presented at the Graphic Design and Typography I course at Linn\u00e6us University.  Created a website for the association I called No Plastic Food (NPF), not only spreads awareness about the problem but also gives an opportunity to get acquainted with the cause and join it. I wanted my design to evoke feelings and be quite striking and different from other similar causes, therefore I opted for bright bold colors and images. I believe that if design evokes emotions, it is going to be remembered. When it comes to images, I wanted people to be able to relate even more with the problem, because it may have a higher chance of getting people on board.<br>I also created a logo, which consists of the letters used in the name of the association.<\/p>\n\n\n\n<div style=\"height:47px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h2 class=\"alignwide wp-block-heading\" id=\"TIE_12\">Future Work<\/h2>\n\n\n\n<p class=\"alignwide wp-block-paragraph\">Future work would consist of creating a prototype on Figma, including not only a homepage but also About, News and Join Us. That prototype would be user-tested to optimize the experience and fix any possible unsatisfactions.<\/p>\n\n\n\n<div style=\"height:47px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<p class=\"wp-block-paragraph\">Original pictures used in the project: <a href=\"https:\/\/unsplash.com\/@unarchive\" target=\"_blank\" rel=\"noopener\"><strong>Jeremy Bezanger<\/strong> <\/a>on<a href=\"https:\/\/unsplash.com\" target=\"_blank\" rel=\"noopener\"> Unsplash<\/a>, <a href=\"https:\/\/www.freepik.com\/cookie-studio\" target=\"_blank\" rel=\"noopener\">cookie_studio<\/a> on <a href=\"https:\/\/www.freepik.com\" target=\"_blank\" rel=\"noopener\">Freepik<\/a><\/p>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" src=\"http:\/\/ematkiewicz.com\/wp-content\/uploads\/2022\/02\/Website-Matkevits5.jpg\" alt=\"\" class=\"wp-image-618\"\/><\/figure>\n<\/div>\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>2022UX\/UI ProjectFinal assignment for the Graphic Design courseProject duration: 1 month TeamElizabeth Matkiewicz Project Description This is a UX\/UI project for the final assignment in Graphic Design and Typography I course at Linn\u00e6us University: \"A website enabling the public to take action against plastic manufacturers\". The project is for a made-up association of lawyers, politicians, [&hellip;]<\/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-612","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"http:\/\/ematkiewicz.com\/index.php\/wp-json\/wp\/v2\/pages\/612","targetHints":{"allow":["GET"]}}],"collection":[{"href":"http:\/\/ematkiewicz.com\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"http:\/\/ematkiewicz.com\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"http:\/\/ematkiewicz.com\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/ematkiewicz.com\/index.php\/wp-json\/wp\/v2\/comments?post=612"}],"version-history":[{"count":26,"href":"http:\/\/ematkiewicz.com\/index.php\/wp-json\/wp\/v2\/pages\/612\/revisions"}],"predecessor-version":[{"id":664,"href":"http:\/\/ematkiewicz.com\/index.php\/wp-json\/wp\/v2\/pages\/612\/revisions\/664"}],"wp:attachment":[{"href":"http:\/\/ematkiewicz.com\/index.php\/wp-json\/wp\/v2\/media?parent=612"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}