{"id":3101,"date":"2020-12-16T22:03:02","date_gmt":"2020-12-16T22:03:02","guid":{"rendered":"https:\/\/www.wendyzhou.se\/blog\/?p=3101"},"modified":"2020-12-30T00:05:34","modified_gmt":"2020-12-30T00:05:34","slug":"app-ui-design-in-figma-speed-video","status":"publish","type":"post","link":"https:\/\/www.wendyzhou.se\/blog\/app-ui-design-in-figma-speed-video\/","title":{"rendered":"App UI Design in Figma (Speed UI Design YouTube Video)"},"content":{"rendered":"\n<p>I love watching people in the process of making UI designs. So, I decided to make my own<a href=\"https:\/\/www.youtube.com\/watch?v=nRfzqiQJSwk\"> YouTube video of an app UI design in Figma<\/a>. In this one, I&#8217;m creating a screen of my own product concept. <\/p>\n\n\n\n<p>Read more about the entire app concept further down in this post.<\/p>\n\n\n\n<p>You may also like: <a href=\"https:\/\/www.wendyzhou.se\/blog\/ux-ui-design-programs-and-applications\/\">The 6 Best UX\/UI Design Tools for 2021<\/a><\/p>\n\n\n\n<h2 class=\"wp-block-heading\">The YouTube Speed Design Video<\/h2>\n\n\n\n<p>Here&#8217;s the video of me designing the calendar view of the app.<\/p>\n\n\n\n<figure class=\"wp-block-embed is-type-video is-provider-youtube wp-block-embed-youtube wp-embed-aspect-16-9 wp-has-aspect-ratio\"><div class=\"wp-block-embed__wrapper\">\n<p class=\"responsive-video-wrap clr\"><iframe loading=\"lazy\" title=\"App UI Design In Figma - Speed UI Design\" width=\"1200\" height=\"675\" src=\"https:\/\/www.youtube.com\/embed\/nRfzqiQJSwk?feature=oembed\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\" referrerpolicy=\"strict-origin-when-cross-origin\" allowfullscreen><\/iframe><\/p>\n<\/div><figcaption>App UI design in Figma<\/figcaption><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\">The app concept <\/h2>\n\n\n\n<p>Here&#8217;s a view of the end result of the app design idea. This is still only in mockup and prototype, and not in code.<\/p>\n\n\n\n<figure class=\"wp-block-video\"><video controls src=\"https:\/\/www.wendyzhou.se\/blog\/wp-content\/uploads\/2020\/12\/AppDesignVideo.mov\"><\/video><figcaption>Journaling app in dark mode<\/figcaption><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\">My goal with this project<\/h3>\n\n\n\n<p>This is a concept idea I had for a journaling app in dark mode. I want to use an app like this but couldn&#8217;t find one in the app store. So, why not create my own?<\/p>\n\n\n\n<p>In the future, I want to make it into a real mobile app. But first I need to learn how to code that well or get the money to hire a developer. We&#8217;ll see. But I&#8217;m sure that I&#8217;ll make this into a real app someday.<\/p>\n\n\n\n<p>Maybe I&#8217;ll get lucky and some developer will see this and likes the idea, and create it! <\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Concept of the app<\/h3>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"925\" src=\"https:\/\/www.wendyzhou.se\/blog\/wp-content\/uploads\/2020\/12\/Journal-App-Design-1024x925.png\" alt=\"Journaling App UI design mockup\" class=\"wp-image-3104\" srcset=\"https:\/\/www.wendyzhou.se\/blog\/wp-content\/uploads\/2020\/12\/Journal-App-Design-1024x925.png 1024w, https:\/\/www.wendyzhou.se\/blog\/wp-content\/uploads\/2020\/12\/Journal-App-Design-300x271.png 300w, https:\/\/www.wendyzhou.se\/blog\/wp-content\/uploads\/2020\/12\/Journal-App-Design-768x694.png 768w, https:\/\/www.wendyzhou.se\/blog\/wp-content\/uploads\/2020\/12\/Journal-App-Design-1536x1387.png 1536w, https:\/\/www.wendyzhou.se\/blog\/wp-content\/uploads\/2020\/12\/Journal-App-Design.png 1735w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><figcaption>Start page of the app<\/figcaption><\/figure>\n\n\n\n<p><strong>The image above is the start page of the app. <\/strong>Here, you can quickly write one or two short sentences or notes about your day. You can also very quickly add your daily activities and how you&#8217;re feeling by clicking on the cards.<\/p>\n\n\n\n<p>I designed this mobile app with the idea that it shouldn&#8217;t take a long time or much of an effort to record your daily feelings and habits. You should be able to do it in under 3 minutes!<\/p>\n\n\n\n<p>Then of course you&#8217;d also have a calendar view that you can go to so that you can see your old entries. This calendar screen is the one I&#8217;m creating in the YouTube video.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Interested in seeing more?<\/h2>\n\n\n\n<p>Here&#8217;s a few similar articles and videos I&#8217;ve made<\/p>\n\n\n\n<ul class=\"wp-block-list\"><li><a href=\"https:\/\/www.wendyzhou.se\/blog\/how-to-import-sketch-to-figma\/\">How to Import Sketch to Figma?<\/a><\/li><li><a href=\"https:\/\/www.wendyzhou.se\/blog\/learn-ux-ui-design-books\/\">Best 4 Books to Learn UX\/UI Design for Beginners<\/a><\/li><li><a href=\"https:\/\/www.wendyzhou.se\/blog\/how-to-export-after-effects-as-mp4-without-media-encoder-2019\/\">How to export After Effects as MP4 (without Media Encoder) 2021<\/a><\/li><\/ul>\n","protected":false},"excerpt":{"rendered":"<p>I love seeing UI design being created. So, I decided to make my own video. Here&#8217;s me, creating an app UI design in Figma. <\/p>\n","protected":false},"author":1,"featured_media":3861,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_uag_custom_page_level_css":"","footnotes":""},"categories":[166,175,6],"tags":[],"class_list":["post-3101","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-tutorials","category-ui-design","category-ux-and-ui-design","entry","has-media"],"gutentor_comment":0,"uagb_featured_image_src":{"full":["https:\/\/www.wendyzhou.se\/blog\/wp-content\/uploads\/2020\/12\/App-UI-Design-in-Figma.png",1280,720,false],"thumbnail":["https:\/\/www.wendyzhou.se\/blog\/wp-content\/uploads\/2020\/12\/App-UI-Design-in-Figma-150x150.png",150,150,true],"medium":["https:\/\/www.wendyzhou.se\/blog\/wp-content\/uploads\/2020\/12\/App-UI-Design-in-Figma-300x169.png",300,169,true],"medium_large":["https:\/\/www.wendyzhou.se\/blog\/wp-content\/uploads\/2020\/12\/App-UI-Design-in-Figma-768x432.png",768,432,true],"large":["https:\/\/www.wendyzhou.se\/blog\/wp-content\/uploads\/2020\/12\/App-UI-Design-in-Figma-1024x576.png",1024,576,true],"1536x1536":["https:\/\/www.wendyzhou.se\/blog\/wp-content\/uploads\/2020\/12\/App-UI-Design-in-Figma.png",1280,720,false],"2048x2048":["https:\/\/www.wendyzhou.se\/blog\/wp-content\/uploads\/2020\/12\/App-UI-Design-in-Figma.png",1280,720,false],"ocean-thumb-m":["https:\/\/www.wendyzhou.se\/blog\/wp-content\/uploads\/2020\/12\/App-UI-Design-in-Figma.png",600,338,false],"ocean-thumb-ml":["https:\/\/www.wendyzhou.se\/blog\/wp-content\/uploads\/2020\/12\/App-UI-Design-in-Figma.png",800,450,false],"ocean-thumb-l":["https:\/\/www.wendyzhou.se\/blog\/wp-content\/uploads\/2020\/12\/App-UI-Design-in-Figma.png",1200,675,false]},"uagb_author_info":{"display_name":"Wendy Zhou","author_link":"https:\/\/www.wendyzhou.se\/blog\/author\/wendy1111live-se\/"},"uagb_comment_info":0,"uagb_excerpt":"I love seeing UI design being created. So, I decided to make my own video. Here's me, creating an app UI design in Figma.","_links":{"self":[{"href":"https:\/\/www.wendyzhou.se\/blog\/wp-json\/wp\/v2\/posts\/3101","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.wendyzhou.se\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.wendyzhou.se\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.wendyzhou.se\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.wendyzhou.se\/blog\/wp-json\/wp\/v2\/comments?post=3101"}],"version-history":[{"count":3,"href":"https:\/\/www.wendyzhou.se\/blog\/wp-json\/wp\/v2\/posts\/3101\/revisions"}],"predecessor-version":[{"id":3107,"href":"https:\/\/www.wendyzhou.se\/blog\/wp-json\/wp\/v2\/posts\/3101\/revisions\/3107"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.wendyzhou.se\/blog\/wp-json\/wp\/v2\/media\/3861"}],"wp:attachment":[{"href":"https:\/\/www.wendyzhou.se\/blog\/wp-json\/wp\/v2\/media?parent=3101"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.wendyzhou.se\/blog\/wp-json\/wp\/v2\/categories?post=3101"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.wendyzhou.se\/blog\/wp-json\/wp\/v2\/tags?post=3101"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}