{"id":4142,"date":"2020-10-18T15:53:09","date_gmt":"2020-10-18T19:53:09","guid":{"rendered":"https:\/\/undsgn.com\/uncode\/?post_type=portfolio&p=4142"},"modified":"2021-01-13T14:36:05","modified_gmt":"2021-01-13T18:36:05","slug":"craft","status":"publish","type":"portfolio","link":"https:\/\/cherisha.net\/portfolio\/craft\/","title":{"rendered":"CRAFT"},"content":{"rendered":"
[vc_row row_height_percent=”0″ overlay_alpha=”50″ gutter_size=”3″ column_width_percent=”100″ shift_y=”-2″ z_index=”0″][vc_column width=”1\/1″][vc_single_image media=”82857″ caption=”yes” media_width_percent=”100″ alignment=”center”][vc_column_text text_lead=”yes”]Microsoft Inclusive Design Challenge <\/strong>\u2013 Design a product, service, or solution to solve for exclusion in a deskless workplace by integrating inclusive design principles to build a solution to enable people with disabilities working in deskless workplace to improve diversity in design.<\/span><\/p>\n Problem Statement<\/b> \u2013 How might we design a tool for people with limited mobility in their arms to create art in Virtual Reality?<\/span><\/p>\n Solution<\/b> \u2013 Our team designed a tool called ‘Craft’ using principles of multi-modality\u2018, that allows people with limited mobility in their arms to create 3D art in Virtual Reality using voice commands and eye movements. Multi modal human-computer interaction refers to the interaction with the virtual and physical environment through natural modes of communication.\u00a0<\/span>[\/vc_column_text][\/vc_column][\/vc_row][vc_row row_height_percent=”0″ overlay_alpha=”50″ gutter_size=”3″ column_width_percent=”100″ shift_y=”-1″ z_index=”0″][vc_column column_width_percent=”100″ gutter_size=”3″ overlay_alpha=”50″ shift_x=”0″ shift_y=”-2″ shift_y_down=”0″ z_index=”0″ medium_width=”0″ mobile_width=”0″ width=”1\/1″][vc_single_image media=”82859″ caption=”yes” media_width_percent=”100″ alignment=”center”][\/vc_column][\/vc_row][vc_row row_height_percent=”0″ overlay_alpha=”50″ gutter_size=”3″ column_width_percent=”100″ shift_y=”-2″ z_index=”0″][vc_column width=”1\/1″][vc_column_text text_lead=”yes”]Team<\/b>: Cherisha Agarwal, Joanna Yen, Pratik Jain, Shimin Gu, Raksha Ravimohan, Srishti Kush<\/span><\/p>\n My role<\/b>: I actively contributed to the UX design process by conducting the user interviews and testing to analyze the results and document the insights and helped in the various prototypes for our project. I worked on designing the personas and various other digital assets. I was responsible for designing the style guide for our project booklet and designed the entire booklet layout and graphics. I was also responsible to lead the team for the XR Startup Bootcamp for this project concept where we analyzed the business model and product market fit.<\/span><\/p>\n Tools used<\/b>: Adobe InDesign, Adobe Photoshop, Adobe Illustrator, Adobe Premiere Pro, Sketch, Unreal<\/span>[\/vc_column_text][vc_separator][\/vc_column][\/vc_row][vc_row row_height_percent=”0″ overlay_alpha=”50″ gutter_size=”3″ column_width_percent=”100″ shift_y=”2″ z_index=”0″][vc_column column_width_percent=”100″ gutter_size=”3″ overlay_alpha=”50″ shift_x=”0″ shift_y=”-3″ shift_y_down=”0″ z_index=”0″ medium_width=”0″ mobile_width=”0″ width=”1\/1″][vc_custom_heading text_size=”h3″]DESIGN PROCESS<\/b>[\/vc_custom_heading][\/vc_column][\/vc_row][vc_row row_height_percent=”0″ overlay_alpha=”50″ gutter_size=”3″ column_width_percent=”100″ shift_y=”-2″ z_index=”0″][vc_column column_width_percent=”100″ gutter_size=”3″ overlay_alpha=”50″ shift_x=”0″ shift_y=”-3″ shift_y_down=”0″ z_index=”0″ medium_width=”0″ mobile_width=”0″ width=”1\/1″][vc_single_image media=”82832″ media_width_percent=”100″][\/vc_column][\/vc_row][vc_row row_height_percent=”0″ overlay_alpha=”50″ gutter_size=”3″ column_width_percent=”100″ shift_y=”-1″ z_index=”0″][vc_column width=”1\/1″][vc_custom_heading text_size=”h3″]Research & Brainstorming<\/b>[\/vc_custom_heading][\/vc_column][\/vc_row][vc_row row_height_percent=”0″ overlay_alpha=”50″ gutter_size=”3″ column_width_percent=”100″ shift_y=”-1″ z_index=”0″][vc_column column_width_percent=”100″ gutter_size=”3″ overlay_alpha=”50″ shift_x=”0″ shift_y=”-2″ shift_y_down=”0″ z_index=”0″ medium_width=”0″ mobile_width=”0″ width=”1\/1″][vc_column_text text_lead=”yes”]Since we had the freedom to create any product we wanted to, based on our interests we came up with different professions and disabilities that the team wanted to focus on based on our target audience. After deciding the professions, the following process was followed:<\/span><\/p>\n [\/vc_column_text][\/vc_column][\/vc_row][vc_row row_height_percent=”0″ overlay_alpha=”50″ gutter_size=”3″ column_width_percent=”100″ shift_y=”-3″ z_index=”0″][vc_column width=”1\/1″][vc_gallery el_id=”gallery-181023″ type=”carousel” medias=”82834,82835″ carousel_lg=”1″ carousel_md=”1″ carousel_sm=”1″ thumb_size=”sixteen-nine” gutter_size=”3″ carousel_interval=”3000″ carousel_navspeed=”400″ carousel_loop=”yes” carousel_overflow=”yes” carousel_dots=”yes” carousel_dots_mobile=”yes” stage_padding=”0″ single_overlay_opacity=”1″ single_padding=”2″][\/vc_column][\/vc_row][vc_row row_height_percent=”0″ overlay_alpha=”50″ gutter_size=”3″ column_width_percent=”100″ shift_y=”-3″ z_index=”0″][vc_column width=”1\/1″][vc_custom_heading text_size=”h4″]Insights from Artists and Designers<\/b>[\/vc_custom_heading][\/vc_column][\/vc_row][vc_row row_height_percent=”0″ overlay_alpha=”50″ gutter_size=”3″ column_width_percent=”100″ shift_y=”-3″ z_index=”0″][vc_column column_width_percent=”100″ gutter_size=”3″ overlay_alpha=”50″ shift_x=”0″ shift_y=”-2″ shift_y_down=”0″ z_index=”0″ medium_width=”0″ mobile_width=”0″ width=”1\/1″][vc_column_text text_lead=”yes”]To get more clarity on our idea, we decided to speak with artists and creative technologists, to understand their workflow. These artists were mainly students from NYU or working professionals who worked on illustrations, cinema, music, 3D modelling, graphic design and game design. The students helped us in figuring out the different pain points and learning curve. <\/span>The responses were very insightful in conveying tools and softwares used and how to frame solutions if the same softwares were to be used by people with disabilities. We also discussed the idea of multi-modal input as a means of interaction for persons with limited hand mobility. They provided useful insights where eye tracking could work in the softwares.<\/span>[\/vc_column_text][\/vc_column][\/vc_row][vc_row row_height_percent=”0″ overlay_alpha=”50″ gutter_size=”3″ column_width_percent=”100″ shift_y=”-1″ z_index=”0″][vc_column width=”1\/1″][vc_single_image media=”82836″ media_width_percent=”100″][\/vc_column][\/vc_row][vc_row row_height_percent=”0″ overlay_alpha=”50″ gutter_size=”3″ column_width_percent=”100″ shift_y=”-2″ z_index=”0″][vc_column width=”1\/1″][vc_gallery el_id=”gallery-185721″ type=”carousel” medias=”82837,82838″ carousel_lg=”1″ carousel_md=”1″ carousel_sm=”1″ gutter_size=”3″ carousel_interval=”3000″ carousel_navspeed=”400″ carousel_loop=”yes” carousel_overflow=”yes” carousel_dots=”yes” carousel_dots_mobile=”yes” stage_padding=”0″ single_overlay_opacity=”1″ single_padding=”2″][\/vc_column][\/vc_row][vc_row row_height_percent=”0″ overlay_alpha=”50″ gutter_size=”3″ column_width_percent=”100″ shift_y=”-2″ z_index=”0″][vc_column width=”1\/1″][vc_custom_heading text_size=”h4″]Secondary Research<\/b>[\/vc_custom_heading][\/vc_column][\/vc_row][vc_row row_height_percent=”0″ overlay_alpha=”50″ gutter_size=”3″ column_width_percent=”100″ shift_y=”2″ z_index=”0″][vc_column column_width_percent=”100″ gutter_size=”3″ overlay_alpha=”50″ shift_x=”0″ shift_y=”-4″ shift_y_down=”0″ z_index=”0″ medium_width=”0″ mobile_width=”0″ width=”1\/1″][vc_column_text text_lead=”yes”]The current market is flooded with options to draw art in Virtual Reality. Some of the options are TiltBrush, Quill, Medium, Block by Google. Apart from these popular tools there are many other upcoming tools which are now available including Make VR, Gravity Sketch and Mozilla A-Painter. <\/span>We tried on the VR headset to get a sense of the 3D art interactions in Virtual Reality by immersing ourselves with Medium, TiltBrush and HoloLens to understand the current features and functionalities. Surprisingly, the apps and headsets meant for VR did not have accessibility features and are completely unusable for someone with limited mobility. Here are some of our observations:<\/span><\/p>\n [\/vc_column_text][\/vc_column][\/vc_row][vc_row row_height_percent=”0″ overlay_alpha=”50″ gutter_size=”3″ column_width_percent=”100″ shift_y=”-3″ z_index=”0″][vc_column width=”1\/1″][vc_gallery el_id=”gallery-166984″ type=”carousel” medias=”82839,82840″ carousel_lg=”1″ carousel_md=”1″ carousel_sm=”1″ gutter_size=”3″ carousel_interval=”3000″ carousel_navspeed=”400″ carousel_loop=”yes” carousel_overflow=”yes” carousel_dots=”yes” carousel_dots_mobile=”yes” stage_padding=”0″ single_overlay_opacity=”1″ single_padding=”2″][\/vc_column][\/vc_row][vc_row row_height_percent=”0″ overlay_alpha=”50″ gutter_size=”3″ column_width_percent=”100″ shift_y=”-2″ z_index=”0″][vc_column width=”1\/1″][vc_custom_heading text_size=”h3″]STAKEHOLDER INTERVIEWS<\/b>[\/vc_custom_heading][\/vc_column][\/vc_row][vc_row row_height_percent=”0″ overlay_alpha=”50″ gutter_size=”3″ column_width_percent=”100″ shift_y=”-3″ z_index=”0″][vc_column width=”1\/1″][vc_column_text text_lead=”yes”]To help us understand how we should develop our idea, we needed to get insights from experts in the field and potential users. Since we were foraying into an unexplored territory, we required new perspectives to better understand the interactions and complications involved. Some of the interviews we did were with:<\/span><\/p>\n These interviews gave us a real world experience of how users reacted to our idea. Some of the key insights were as follows:<\/span>[\/vc_column_text][\/vc_column][\/vc_row][vc_row row_height_percent=”0″ overlay_alpha=”50″ gutter_size=”3″ column_width_percent=”100″ shift_y=”-3″ z_index=”0″][vc_column column_width_percent=”100″ gutter_size=”3″ overlay_alpha=”50″ shift_x=”0″ shift_y=”-2″ shift_y_down=”0″ z_index=”0″ medium_width=”0″ mobile_width=”0″ width=”1\/1″][vc_single_image media=”82841″ media_width_percent=”100″ alignment=”center”][\/vc_column][\/vc_row][vc_row row_height_percent=”0″ overlay_alpha=”50″ gutter_size=”3″ column_width_percent=”100″ shift_y=”-2″ z_index=”0″][vc_column width=”1\/1″][vc_gallery el_id=”gallery-945639″ type=”carousel” medias=”82842,82843″ carousel_lg=”1″ carousel_md=”1″ carousel_sm=”1″ gutter_size=”3″ carousel_interval=”3000″ carousel_navspeed=”400″ carousel_loop=”yes” carousel_overflow=”yes” carousel_dots=”yes” carousel_dots_mobile=”yes” stage_padding=”0″ single_overlay_opacity=”1″ single_padding=”2″][\/vc_column][\/vc_row][vc_row row_height_percent=”0″ overlay_alpha=”50″ gutter_size=”3″ column_width_percent=”100″ shift_y=”-2″ z_index=”0″][vc_column width=”1\/1″][vc_custom_heading text_size=”h4″]Personas[\/vc_custom_heading][\/vc_column][\/vc_row][vc_row row_height_percent=”0″ overlay_alpha=”50″ gutter_size=”3″ column_width_percent=”100″ shift_y=”-3″ z_index=”0″][vc_column width=”1\/1″][vc_column_text text_lead=”yes”]Based on our interview insights, we identified four unique persona to focus on for our project. Each persona had their own goals, motivations and frustrations and different mobility levels as well. Hence it helped us make our design more universal in nature.<\/span>[\/vc_column_text][\/vc_column][\/vc_row][vc_row row_height_percent=”0″ overlay_alpha=”50″ gutter_size=”3″ column_width_percent=”100″ shift_y=”2″ z_index=”0″][vc_column column_width_percent=”100″ gutter_size=”3″ overlay_alpha=”50″ shift_x=”0″ shift_y=”-3″ shift_y_down=”0″ z_index=”0″ medium_width=”0″ mobile_width=”0″ width=”1\/1″][vc_single_image media=”82844″ media_width_percent=”100″][\/vc_column][\/vc_row][vc_row row_height_percent=”0″ overlay_alpha=”50″ gutter_size=”3″ column_width_percent=”100″ shift_y=”-2″ z_index=”0″][vc_column width=”1\/1″][vc_custom_heading text_size=”h3″]PERSONA SPECTRUM<\/b>[\/vc_custom_heading][\/vc_column][\/vc_row][vc_row][vc_column column_width_percent=”100″ gutter_size=”3″ overlay_alpha=”50″ shift_x=”0″ shift_y=”-3″ shift_y_down=”0″ z_index=”0″ medium_width=”0″ mobile_width=”0″ width=”1\/1″][vc_column_text text_lead=”yes”]We also established the persona spectrum, which indicate the exclusions we would be solving for as it relates to their story. By designing for someone with a permanent disability, someone with a temporary ailment or situational limitation can also benefit. We defined various ways the solution can be applied across multiple scenarios and contexts of different people with similar motivations.<\/span>[\/vc_column_text][\/vc_column][\/vc_row][vc_row row_height_percent=”0″ overlay_alpha=”50″ gutter_size=”3″ column_width_percent=”100″ shift_y=”2″ z_index=”0″][vc_column column_width_percent=”100″ gutter_size=”3″ overlay_alpha=”50″ shift_x=”0″ shift_y=”-3″ shift_y_down=”0″ z_index=”0″ medium_width=”0″ mobile_width=”0″ width=”1\/1″][vc_single_image media=”82845″ media_width_percent=”100″][\/vc_column][\/vc_row][vc_row row_height_percent=”0″ overlay_alpha=”50″ gutter_size=”3″ column_width_percent=”100″ shift_y=”-2″ z_index=”0″][vc_column width=”1\/1″][vc_custom_heading text_size=”h3″]PROTOTYPING & ITERATION<\/b>[\/vc_custom_heading][\/vc_column][\/vc_row][vc_row row_height_percent=”0″ overlay_alpha=”50″ gutter_size=”3″ column_width_percent=”100″ shift_y=”-3″ z_index=”0″][vc_column width=”1\/1″][vc_column_text text_lead=”yes”]After understanding our persona spectrum and user flow, we proceeded to create basic prototypes to demonstrate and test the concept of our idea. To make our tool accessible, we had to empathize for our users and identify pain points and intuitive ways of interaction. We decided to go for multi modal interaction, since the user has limited hand mobility, we wanted to make use of voice and eye gestures to perform tasks. We wanted to experiment the entire user flow with both eye interactions and voice, to see which is more intuitive. We started with creating a video to demonstrate how voice commands and eye gaze can be used to operate the tool without hands. This prototype helped us demonstrate our idea and make it understandable to our users as it was quite a new and unfamiliar concept to many people.<\/span>[\/vc_column_text][vc_column_text text_lead=”yes”]https:\/\/youtu.be\/FJF-9fC7jvo[\/vc_column_text][\/vc_column][\/vc_row][vc_row row_height_percent=”0″ overlay_alpha=”50″ gutter_size=”3″ column_width_percent=”100″ shift_y=”-2″ z_index=”0″][vc_column width=”1\/1″][vc_single_image media=”82846″ media_width_percent=”100″][\/vc_column][\/vc_row][vc_row row_height_percent=”0″ overlay_alpha=”50″ gutter_size=”3″ column_width_percent=”100″ shift_y=”-2″ z_index=”0″][vc_column width=”1\/1″][vc_custom_heading text_size=”h4″]Paper Prototype<\/b>[\/vc_custom_heading][\/vc_column][\/vc_row][vc_row row_height_percent=”0″ overlay_alpha=”50″ gutter_size=”3″ column_width_percent=”100″ shift_y=”-3″ z_index=”0″][vc_column width=”1\/1″][vc_column_text text_lead=”yes”]After working on the video prototype, we compiled our product features and interactions. Once we got insights from professionals, we decided to build a paper prototype. The idea was to build something simple which we could take to our users and test it out. We were looking to add common and easy to comprehend tools. We came up with a list of tools which included drawing tools, system tools and functionality tools. After this we printed out each tool icon on a A4 sheet as demonstrated in the pictures below.<\/span>[\/vc_column_text][\/vc_column][\/vc_row][vc_row row_height_percent=”0″ overlay_alpha=”50″ gutter_size=”3″ column_width_percent=”100″ shift_y=”-1″ z_index=”0″][vc_column width=”1\/1″][vc_single_image media=”82849″ media_width_percent=”100″][\/vc_column][\/vc_row][vc_row][vc_column width=”1\/1″][vc_gallery el_id=”gallery-153815″ type=”carousel” medias=”82847,82848″ carousel_lg=”1″ carousel_md=”1″ carousel_sm=”1″ gutter_size=”3″ carousel_interval=”3000″ carousel_navspeed=”400″ carousel_loop=”yes” carousel_overflow=”yes” carousel_dots=”yes” carousel_dots_mobile=”yes” stage_padding=”0″ single_overlay_opacity=”1″ single_padding=”2″][\/vc_column][\/vc_row][vc_row row_height_percent=”0″ overlay_alpha=”50″ gutter_size=”3″ column_width_percent=”100″ shift_y=”-1″ z_index=”0″][vc_column column_width_percent=”100″ gutter_size=”3″ overlay_alpha=”50″ shift_x=”0″ shift_y=”-1″ shift_y_down=”0″ z_index=”0″ medium_width=”0″ mobile_width=”0″ width=”1\/1″][vc_custom_heading text_size=”h3″]USER TESTING<\/b>[\/vc_custom_heading][\/vc_column][\/vc_row][vc_row row_height_percent=”0″ overlay_alpha=”50″ gutter_size=”3″ column_width_percent=”100″ shift_y=”-3″ z_index=”0″][vc_column width=”1\/1″][vc_column_text text_lead=”yes”]After our prototype was ready, we wanted to come up with a cheap and easy solution to demonstrate eye tracking. We concluded that a laser pen would be the most optimal way to do that. Our plan was to attach the laser to pen on a hat and once the person moved their head, the beam of the laser would move. This would give an idea to the user where they were pointing on the paper prototype. Once the user gazes at a particular tool, the selected tool is highlighted using the blue-violet light. To draw, the user would move the laser point across the canvas and a student would trace the trajectory using a marker. Some of the tools such as scale and color palette were made expandable and we used different sheets of paper to make pop ups. We decided to test it with designers and artists with experience in experience in VR as well as 2D and 3D software drawing tools and normal hand movements to get quick feedback on usability. We then planned to test it with the members of the ADAPT community who had limited hand movement, but were interested in art and the concept of drawing using eye movements.<\/span>[\/vc_column_text][\/vc_column][\/vc_row][vc_row row_height_percent=”0″ overlay_alpha=”50″ gutter_size=”3″ column_width_percent=”100″ shift_y=”-1″ z_index=”0″][vc_column width=”1\/1″][vc_gallery el_id=”gallery-174514-326″ type=”carousel” medias=”82850,82851″ carousel_lg=”1″ carousel_md=”1″ carousel_sm=”1″ gutter_size=”3″ carousel_interval=”3000″ carousel_navspeed=”400″ carousel_loop=”yes” carousel_overflow=”yes” carousel_dots=”yes” carousel_dots_mobile=”yes” stage_padding=”0″ single_overlay_opacity=”1″ single_padding=”2″][vc_single_image media=”82852″ media_width_percent=”100″][vc_single_image media=”82853″ media_width_percent=”100″][vc_single_image media=”82854″ media_width_percent=”100″][\/vc_column][\/vc_row][vc_row row_height_percent=”0″ overlay_alpha=”50″ gutter_size=”3″ column_width_percent=”100″ shift_y=”-2″ z_index=”0″][vc_column width=”1\/1″][vc_custom_heading text_size=”h3″]FINAL DEMONSTRATION<\/b>[\/vc_custom_heading][\/vc_column][\/vc_row][vc_row row_height_percent=”0″ overlay_alpha=”50″ gutter_size=”3″ column_width_percent=”100″ shift_y=”-3″ z_index=”0″][vc_column width=”1\/1″][vc_column_text text_lead=”yes”]After understanding our user journey and building our information architecture by reorganizing the tool structure and finalizing on our interactions, we proceeded to create the final hi fidelity prototype using the Unreal Engine. We also did a mockup of an on-boarding AI assistant called Crafty to help new users get familiar with the interface. The assistant guided the user with the features and functionalities of each tool and was available if the user got stuck at any point. The final prototype process included Movement tracking, Interactable user interface, Time-based gaze selection, Teleport function, Painting function and changing the Environment. These tasks helped us accomplish a working prototype which users could interact with in the immersive environment.<\/span>[\/vc_column_text][\/vc_column][\/vc_row][vc_row row_height_percent=”0″ overlay_alpha=”50″ gutter_size=”3″ column_width_percent=”100″ shift_y=”2″ z_index=”0″][vc_column column_width_percent=”100″ gutter_size=”3″ overlay_alpha=”50″ shift_x=”0″ shift_y=”-3″ shift_y_down=”0″ z_index=”0″ medium_width=”0″ mobile_width=”0″ width=”1\/1″][vc_gallery el_id=”gallery-160012″ type=”carousel” medias=”82856,82855″ carousel_lg=”1″ carousel_md=”1″ carousel_sm=”1″ gutter_size=”3″ carousel_interval=”3000″ carousel_navspeed=”400″ carousel_loop=”yes” carousel_overflow=”yes” carousel_dots=”yes” carousel_dots_mobile=”yes” stage_padding=”0″ single_overlay_opacity=”1″ single_padding=”2″][vc_column_text]https:\/\/www.youtube.com\/watch?v=bO8zd7UHTAs[\/vc_column_text][\/vc_column][\/vc_row][vc_row row_height_percent=”0″ overlay_alpha=”50″ gutter_size=”3″ column_width_percent=”100″ shift_y=”-2″ z_index=”0″][vc_column width=”1\/1″][vc_column_text]<\/p>\n [\/vc_column_text][\/vc_column][\/vc_row][vc_row row_height_percent=”0″ overlay_alpha=”50″ gutter_size=”3″ column_width_percent=”100″ shift_y=”-3″ z_index=”0″][vc_column width=”1\/1″][vc_column_text text_lead=”yes”]We have received good feedback for our prototype but we aim to work towards improving it even more especially in the following areas:<\/span><\/p>\n We hope that this tool would be extremely useful for people with limited mobility to not only experience VR but also to create interesting content and share it with the world.<\/span>[\/vc_column_text][\/vc_column][\/vc_row][vc_row row_height_percent=”0″ overlay_alpha=”50″ gutter_size=”3″ column_width_percent=”100″ shift_y=”-2″ z_index=”0″][vc_column column_width_percent=”100″ gutter_size=”3″ overlay_alpha=”50″ shift_x=”0″ shift_y=”-2″ shift_y_down=”0″ z_index=”0″ medium_width=”0″ mobile_width=”0″ width=”1\/1″][vc_column_text]Project Booklet<\/b><\/a><\/p>\n\n
\n
\n
Next Steps<\/strong><\/h3>\n
\n