{"id":438,"date":"2023-08-06T18:59:09","date_gmt":"2023-08-07T01:59:09","guid":{"rendered":"https:\/\/puffyunicorn.me\/?p=438"},"modified":"2025-09-27T13:07:54","modified_gmt":"2025-09-27T20:07:54","slug":"ux-design-part-2-screens-their-purpose","status":"publish","type":"post","link":"https:\/\/puffyunicorn.one\/?p=438","title":{"rendered":"UX Design\u2013Part 2: Screens &#038; their purpose"},"content":{"rendered":"\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"576\" src=\"https:\/\/puffyunicorn.me\/wp-content\/uploads\/2023\/08\/empty-iphone-1024x576.jpg\" alt=\"\" class=\"wp-image-442\" srcset=\"https:\/\/puffyunicorn.one\/wp-content\/uploads\/2023\/08\/empty-iphone-1024x576.jpg 1024w, https:\/\/puffyunicorn.one\/wp-content\/uploads\/2023\/08\/empty-iphone-300x169.jpg 300w, https:\/\/puffyunicorn.one\/wp-content\/uploads\/2023\/08\/empty-iphone-768x432.jpg 768w, https:\/\/puffyunicorn.one\/wp-content\/uploads\/2023\/08\/empty-iphone-100x56.jpg 100w, https:\/\/puffyunicorn.one\/wp-content\/uploads\/2023\/08\/empty-iphone-1536x864.jpg 1536w, https:\/\/puffyunicorn.one\/wp-content\/uploads\/2023\/08\/empty-iphone.jpg 1920w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><figcaption><em>Generated by Adobe Firefly, 4 August 2023.<\/em><\/figcaption><\/figure>\n\n\n\n<p>In my last post, I wrote what the description and basic functionality of my app will be, and this time I&#8217;ve made a list of all the screens and what they&#8217;ll do. This will make it easy for the next step when I sketch out each screen on paper. But first things first. Here&#8217;s a list of each screen and actions\/tasks for each.<\/p>\n\n\n\n<p><strong>Welcome<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\"><li>Button to create profile<\/li><li>Link to log in<\/li><\/ul>\n\n\n\n<p><strong>Login<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\"><li>SSO options<\/li><li>Email or display name<\/li><li>Password<\/li><\/ul>\n\n\n\n<p><strong>Create profile<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\"><li>Display name<\/li><li>Email<\/li><li>Password<\/li><li>Confirm password<\/li><li>Proficiency level<\/li><\/ul>\n\n\n\n<p><strong>Reset password<\/strong><\/p>\n\n\n\n<p><strong>Logged in user<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\"><li>List new conversations<\/li><li>Favorite<\/li><li>Add notes<\/li><li>Share<\/li><li>List completed conversations<\/li><li>List conversations in progress<\/li><li>List saved vocabulary words<\/li><li>Display name<\/li><li>Proficiency level<\/li><li>Change proficiency level<\/li><\/ul>\n\n\n\n<p><strong>View conversation<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\"><li>Play video<\/li><li>List vocabulary and definitions<\/li><li>Save vocabulary word<\/li><li>Translate conversation<\/li><li>Favorite<\/li><li>Add notes<\/li><li>Share<\/li><\/ul>\n\n\n\n<p><strong>Learn vocabulary<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\"><li>Forward and back<\/li><li>Flip card<\/li><li>Pronounce word<\/li><li>Save vocabulary word<\/li><\/ul>\n\n\n\n<p><strong>Quiz<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\"><li>Read question<\/li><li>Read answers<\/li><li>Select answer<\/li><li>Check answer and get feedback<\/li><\/ul>\n\n\n\n<p><strong>Practice conversation<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\"><li>Forward and back<\/li><li>Play prompt<\/li><li>Record response<\/li><li>Replay conversation<\/li><\/ul>\n\n\n\n<p><strong>Completion success<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\"><li>Assessed proficiency level vs set proficiency level<\/li><li>Change proficiency level<\/li><li>Share achievement<\/li><\/ul>\n","protected":false},"excerpt":{"rendered":"<p>In my last post, I wrote what the description and basic functionality of my app will be, and this time I&#8217;ve made a list of all the screens and what they&#8217;ll do. This will make it easy for the next step when I sketch out each screen on paper. But first things first. Here&#8217;s a [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":442,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"cybocfi_hide_featured_image":"yes","_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[23],"tags":[],"class_list":["post-438","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-ux-design"],"jetpack_featured_media_url":"https:\/\/puffyunicorn.one\/wp-content\/uploads\/2023\/08\/empty-iphone.jpg","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/puffyunicorn.one\/index.php?rest_route=\/wp\/v2\/posts\/438","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/puffyunicorn.one\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/puffyunicorn.one\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/puffyunicorn.one\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/puffyunicorn.one\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=438"}],"version-history":[{"count":4,"href":"https:\/\/puffyunicorn.one\/index.php?rest_route=\/wp\/v2\/posts\/438\/revisions"}],"predecessor-version":[{"id":1025,"href":"https:\/\/puffyunicorn.one\/index.php?rest_route=\/wp\/v2\/posts\/438\/revisions\/1025"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/puffyunicorn.one\/index.php?rest_route=\/wp\/v2\/media\/442"}],"wp:attachment":[{"href":"https:\/\/puffyunicorn.one\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=438"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/puffyunicorn.one\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=438"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/puffyunicorn.one\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=438"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}