https://www.chenkatherine.com/about daily 0.75 2021-01-20 https://static1.squarespace.com/static/5e6af611b44ec64c8a2a1302/t/5f76545414406a547337de66/1601590388722/katherineprofile About https://static1.squarespace.com/static/5e6af611b44ec64c8a2a1302/t/5f4dce40efa7cf4ad816328f/1598934597074/KClogo_concept About https://www.chenkatherine.com/bento-ya daily 0.75 2020-10-31 https://static1.squarespace.com/static/5e6af611b44ec64c8a2a1302/t/5f9a1923f143a331a73a72d5/1603934514094/bento_banner Bento-Ya https://static1.squarespace.com/static/5e6af611b44ec64c8a2a1302/t/5ec5d3a9f5127918969d7624/1603929947691/Bento-Ya_Banner Bento-Ya https://static1.squarespace.com/static/5e6af611b44ec64c8a2a1302/t/5f9caeebaa6e763a1bcc820e/1604109421314/bento_designs Bento-Ya https://static1.squarespace.com/static/5e6af611b44ec64c8a2a1302/t/5eb8842c30a3d76767b8ac8c/1590024027744/Bento-Ya_Sitemap Bento-Ya https://static1.squarespace.com/static/5e6af611b44ec64c8a2a1302/t/5f9c98cd622e88214e5adc5c/1604104148040/Bento_TaskFlow Bento-Ya Task flow identifies necessary interactions in core user actions. https://static1.squarespace.com/static/5e6af611b44ec64c8a2a1302/t/5eb884d82ffa577e0272c6cb/1604104108845/Bento_UserFlow Bento-Ya User flow showing decision points throughout the user’s path. https://static1.squarespace.com/static/5e6af611b44ec64c8a2a1302/t/5f9b7c13b12c5e30f45a8f66/1604029739238/bentoya_sketches Bento-Ya Brainstorm sketches on early concepts of content layout and dialog components. https://static1.squarespace.com/static/5e6af611b44ec64c8a2a1302/t/5f9c992c5578154aa84c0af2/1604109455573/bento_midfi_menu Bento-Ya Menu page iterations showed that designs for physical menus may not always work digitally. https://static1.squarespace.com/static/5e6af611b44ec64c8a2a1302/t/5f9c9901f3bdaa66b993466c/1604109451329/bento_midfi_home Bento-Ya Content hierarchy shifted over the course of various iterations. https://static1.squarespace.com/static/5e6af611b44ec64c8a2a1302/t/5eb891ec4a67d3004856ff63/1604104163139/bento_affinitymap Bento-Ya Affinity mapping helped identify patterns in pain points. https://static1.squarespace.com/static/5e6af611b44ec64c8a2a1302/t/5f9cc06f622e88214e5f2138/1604109549130/bento_hifi_main Bento-Ya https://static1.squarespace.com/static/5e6af611b44ec64c8a2a1302/t/5f9cc0a55578154aa850929d/1604109544634/bento_hifi_other Bento-Ya https://static1.squarespace.com/static/5e6af611b44ec64c8a2a1302/t/5f9cc3dc76564e30d9349b2b/1604109724902/bento_imagery Bento-Ya Moodboard imagery was developed with the client to align on brand direction. https://static1.squarespace.com/static/5e6af611b44ec64c8a2a1302/t/5eb88dd02ffa577e0273e592/1604032970262/Bento-Ya_DigitalLogos Bento-Ya Various logo concepts based on client requirements. https://static1.squarespace.com/static/5e6af611b44ec64c8a2a1302/t/5f9cc6443c1ca739af96dc9b/1604109995361/bento_styletile Bento-Ya The final style tile brings together UI elements that dictated the high-fidelity designs. https://www.chenkatherine.com/line-translation daily 0.75 2020-10-31 https://static1.squarespace.com/static/5e6af611b44ec64c8a2a1302/t/5f936104bd21e77cb1ee1ccc/1603494160532/line_casebanner LINE Translation https://static1.squarespace.com/static/5e6af611b44ec64c8a2a1302/t/5f93b4d166dc2c2508cf7d72/1603517809117/LINE_Heuristic LINE Translation The heuristic evaluation revealed inefficient usability in LINE’s existing bot translator. https://static1.squarespace.com/static/5e6af611b44ec64c8a2a1302/t/5f9398013ef9bd77e9938ab8/1603517799853/LINE_survey LINE Translation Key survey results show fluency gap in speaking vs reading/writing a second language. https://static1.squarespace.com/static/5e6af611b44ec64c8a2a1302/t/5f94b7608cd4814a3da852ae/1603581812707/LINE_competitors LINE Translation https://static1.squarespace.com/static/5e6af611b44ec64c8a2a1302/t/5f93bbfeb0954566e61ece9a/1603847874394/LINE_rose-thorn-bud LINE Translation The Rose, Bud, Thorn method maps out key insights from user interview observations. https://static1.squarespace.com/static/5e6af611b44ec64c8a2a1302/t/5ee6986e27fc162ae12801b1/1592012315037/line_interaction LINE Translation Task flows showing 4 key tasks that users would likely go through when translating. https://static1.squarespace.com/static/5e6af611b44ec64c8a2a1302/t/5f98e0d7e9f45f1bb3141258/1603854574575/LINE_Mid-Fi+Wireframes LINE Translation These selected mid-fi wireframes showcase the incoming and outgoing translation flows. https://static1.squarespace.com/static/5e6af611b44ec64c8a2a1302/t/5f98da1933275461f6a6ff08/1603852854284/LINE_sketch-outgoing LINE Translation - Outgoing Translation My assumption was that users would prefer going into a separate translation window than typing in-chat. I decided to test out this assumption during usability testing, and quickly iterate if needed for round 2. https://static1.squarespace.com/static/5e6af611b44ec64c8a2a1302/t/5f98dc0802594d25a37ad7f2/1603857465620/LINE_sketch-incoming LINE Translation - Incoming Translation A tap-to-translate pattern is fast and mimics the initial action of copying text. Users who may not be aware of a translation feature can easily find it if their instinct is to try copying first. https://static1.squarespace.com/static/5e6af611b44ec64c8a2a1302/t/5f98dbf0c6828d31030b46e3/1603853315871/LINE_sketch-selection LINE Translation - Word Selection I referenced Kindle’s design pattern for word selection and lookup. The question is whether users would find this interaction intuitive on LINE. https://static1.squarespace.com/static/5e6af611b44ec64c8a2a1302/t/5f98e736c2aa5b750e336d73/1603856200932/prototype LINE Translation https://static1.squarespace.com/static/5e6af611b44ec64c8a2a1302/t/5ee6fe71dfef8d5c73c5767f/1592436656275/line_hifi01 LINE Translation https://static1.squarespace.com/static/5e6af611b44ec64c8a2a1302/t/5ee6fe8a27fc162ae13406eb/1592436656279/line_hifi02 LINE Translation https://static1.squarespace.com/static/5e6af611b44ec64c8a2a1302/t/5ee6fea0b8c5f829926a7958/1592436656282/line_hifi03 LINE Translation https://www.chenkatherine.com/kaus daily 0.75 2020-10-23 https://static1.squarespace.com/static/5e6af611b44ec64c8a2a1302/t/5f8e5b43a72f256e0c90e769/1603494116726/kaus_casebanner.png Kaus https://static1.squarespace.com/static/5e6af611b44ec64c8a2a1302/t/5eeac69ffe09e11c07e3fe84/1603164130881/kaus_cardsort Kaus - How might the user search for different types of insurance? Sample of a participant’s card sorting result. https://static1.squarespace.com/static/5e6af611b44ec64c8a2a1302/t/5eeaf9abea41e438e4fca96b/1603152456500/kaus_quote Kaus Form flow patterns used by existing e-commerce companies were analyzed when designing the quote request flow. https://static1.squarespace.com/static/5e6af611b44ec64c8a2a1302/t/5eeabe593e3c7674efe6c9b0/1603152456486/kaus_researchpng Kaus A research ramp up gave a quick and comprehensive overview of the industry, competitors, and potential users. https://static1.squarespace.com/static/5e6af611b44ec64c8a2a1302/t/5eeabdfe34526e3f81c75c02/1603152456483/kaus_framework.png Kaus https://static1.squarespace.com/static/5e6af611b44ec64c8a2a1302/t/5f162f5f411ca57eafa5a578/1603152456489/Persona+Development_Katherine+v3.png Kaus Persona development would help focus all upcoming design and strategy efforts. https://static1.squarespace.com/static/5e6af611b44ec64c8a2a1302/t/5eec008119885a7dd9dc9475/1603152456505/kaus_final01 Kaus https://static1.squarespace.com/static/5e6af611b44ec64c8a2a1302/t/5eec00af96099f43cb7cb7a4/1603152456511/kaus_final03 Kaus https://static1.squarespace.com/static/5e6af611b44ec64c8a2a1302/t/5eec009ccd26ac7fd732dc7d/1603152456508/kaus_final02 Kaus https://static1.squarespace.com/static/5e6af611b44ec64c8a2a1302/t/5eeaf95bea41e438e4fca47f/1603152456497/kaus_homepage Kaus Mid-fi wireframe for homepage, introducing the company and offerings. https://static1.squarespace.com/static/5e6af611b44ec64c8a2a1302/t/5eeaf824ca509d4e36abf6cc/1603152456502/kaus_ui Kaus The UI Kit brings together logo, style, and visual assets for Kaus’ website. https://static1.squarespace.com/static/5e6af611b44ec64c8a2a1302/t/5eeac61b1bd2ba4e91bf4d20/1603152456494/kaus_sitemap.jpg Kaus Insights from the card sorting exercise were used to drive the implementation of Kaus’ sitemap. https://www.chenkatherine.com/feather daily 0.75 2021-01-21 https://static1.squarespace.com/static/5e6af611b44ec64c8a2a1302/t/5f7536e30121d07afb8b8a05/1603494103213/feather_casebanner Feather https://static1.squarespace.com/static/5e6af611b44ec64c8a2a1302/t/5f8cda9b4ac4b64f8c2dc363/1603927151747/feather_app_image Feather https://static1.squarespace.com/static/5e6af611b44ec64c8a2a1302/t/5f0e40a4daced16485db04c0/1602210221126/feather_competitors Feather Comparing features between top birding apps revealed niche functionality https://static1.squarespace.com/static/5e6af611b44ec64c8a2a1302/t/5f7fca0d31dd3d45739a60db/1602210277172/persona_henry Feather The secondary persona could be used in the future for further development https://static1.squarespace.com/static/5e6af611b44ec64c8a2a1302/t/5f7fca0d31dd3d45739a60d8/1603517486608/persona_maddie Feather The casual / beginner birder persona was used as the primary persona https://static1.squarespace.com/static/5e6af611b44ec64c8a2a1302/t/5f0e448c9ffd6f126800548c/1603517492597/feather_journeymap Feather Mapping out the user journey map showed important touch points before and after observing a bird https://static1.squarespace.com/static/5e6af611b44ec64c8a2a1302/t/5f0e45bcdd10062da89da277/1603517499039/feather_sketches Feather Sketches showing the flows for three different methods of bird identification - photo, audio, and text https://static1.squarespace.com/static/5e6af611b44ec64c8a2a1302/t/5f8ce636d6ac4602afc02e3c/1603927151751/identification_nav Feather https://static1.squarespace.com/static/5e6af611b44ec64c8a2a1302/t/5f8a5021ce7cf718b1d6b2c1/1603927151759/onboarding+screens+text.png Feather https://static1.squarespace.com/static/5e6af611b44ec64c8a2a1302/t/5f8a469143cae431e86b93ce/1603927151757/feather_styletilerevised.png Feather https://static1.squarespace.com/static/5e6af611b44ec64c8a2a1302/t/5f8a46f336bb26162d0f2401/1603927151754/feather_logoiterations2.png Feather https://static1.squarespace.com/static/5e6af611b44ec64c8a2a1302/t/5f8a30312a8b041a1ba3c5d8/1602895481199/recording-audiosuccess.gif Feather - Delightful Interactions I learned from users that successfully identifying a bird makes them feel good and accomplished. This was an emotion I wanted to recreate in the app. Adding an ID success animation brings forth that satisfaction upon selecting the final button in the identification flows. https://static1.squarespace.com/static/5e6af611b44ec64c8a2a1302/t/5f8a21a436835c73a79230a5/1602895473709/recording-text.gif Feather - Simplified ID flow The audio and photo ID features are immediate and help reduce cognitive load on the user, but using them may not always be possible. With a simplified description ID flow, users can - Easily insert in key characteristics to be matched with most likely species. Complete the search quickly even with only one hand. https://static1.squarespace.com/static/5e6af611b44ec64c8a2a1302/t/5f8a3e39d83d21326c4cce39/1603927151762/recording-guide.gif Feather - Considering Seasonality The field guide was designed to make it easy and fun to search for birds. Narrow down results with just a few taps by filtering for birds in their current area and season. Content strategy for these screens involved determining which information was most useful (based on user responses) and organizing the content hierarchy. https://static1.squarespace.com/static/5e6af611b44ec64c8a2a1302/t/5f8cf5a7ed952341d89fa0f8/1603927151764/usability+test+-+laptop+hug.png Feather https://static1.squarespace.com/static/5e6af611b44ec64c8a2a1302/t/5f8a4756766f8c0c9678e5e6/1603517550069/feather+home+and+explore Feather https://static1.squarespace.com/static/5e6af611b44ec64c8a2a1302/t/5f8a48a4b735da15b130051e/1603517554747/feather+field+guide Feather https://static1.squarespace.com/static/5e6af611b44ec64c8a2a1302/t/5f8a473d6576621755122e2d/1603517558749/feather+ID+flows Feather https://www.chenkatherine.com/work daily 1.0 2021-01-20 https://static1.squarespace.com/static/5e6af611b44ec64c8a2a1302/t/5f764c877011f45bdd0720ca/1601588401549/KC_illustration WORK https://static1.squarespace.com/static/5e6af611b44ec64c8a2a1302/t/5f6024ecb8cf781619575e60/1600219997219/featherapp WORK https://static1.squarespace.com/static/5e6af611b44ec64c8a2a1302/t/5f6024ecb8cf781619575e72/1600220020673/kaus WORK https://static1.squarespace.com/static/5e6af611b44ec64c8a2a1302/t/5f6024ecb8cf781619575e63/1603928039572/line-translation WORK https://static1.squarespace.com/static/5e6af611b44ec64c8a2a1302/t/5f6024ecb8cf781619575e6c/1603927370872/RTB_podcast WORK https://static1.squarespace.com/static/5e6af611b44ec64c8a2a1302/t/5f6024ecb8cf781619575e66/1603927353005/bentoya WORK https://static1.squarespace.com/static/5e6af611b44ec64c8a2a1302/t/5f610aedfb56df253d2a809b/1603927362022/healthcarestaffing WORK