https://ziganna.me Ziganna Sat, 31 Jul 2021 09:15:04 +0000 https://ziganna.me en https://ziganna.me/Work Thu, 01 Jul 2021 20:04:29 +0000 Ziganna https://ziganna.me/Work https://ziganna.me/Data-in-Space Fri, 02 Jul 2021 11:32:41 +0000 Ziganna https://ziganna.me/Data-in-Space Data in SpaceData and insights in the physical space [Role] Lead product designer, Experience definition Power BI, AR design, 2020-Present <img width="2532" height="1170" width_o="2532" height_o="1170" data-src="https://freight.cargo.site/t/original/i/ea9d2f32a9c54a30b8fc1f1cdc367c1f01fe8f0f8606052150a19c43537a2d38/DIS_inner011.jpg" data-mid="117910766" border="0" alt="Data in Space, Power BI Mobile, report card in scanning view, 01." data-caption="Data in Space, Power BI Mobile, report card in scanning view, 01." src="https://freight.cargo.site/w/1000/i/ea9d2f32a9c54a30b8fc1f1cdc367c1f01fe8f0f8606052150a19c43537a2d38/DIS_inner011.jpg" /> <img width="2532" height="1170" width_o="2532" height_o="1170" data-src="https://freight.cargo.site/t/original/i/e8db2c7b3dbb8b6cdba23da1da10d5748e90623b04e32aeb8b15defb5729b618/DIS_inner022.jpg" data-mid="117910767" border="0" alt="Data in Space, Power BI Mobile, report card in scanning view, 02." data-caption="Data in Space, Power BI Mobile, report card in scanning view, 02." src="https://freight.cargo.site/w/1000/i/e8db2c7b3dbb8b6cdba23da1da10d5748e90623b04e32aeb8b15defb5729b618/DIS_inner022.jpg" /> <img width="2431" height="1123" width_o="2431" height_o="1123" data-src="https://freight.cargo.site/t/original/i/f97d15524292c68a57b9d2f2bd7d9563a8350741e08fa5775dd44d6118fbf67d/DIS_inner033.jpg" data-mid="117910768" border="0" alt="Data in Space, Power BI Mobile, report card in scanning view, 03." data-caption="Data in Space, Power BI Mobile, report card in scanning view, 03." src="https://freight.cargo.site/w/1000/i/f97d15524292c68a57b9d2f2bd7d9563a8350741e08fa5775dd44d6118fbf67d/DIS_inner033.jpg" /> <img width="2380" height="1100" width_o="2380" height_o="1100" data-src="https://freight.cargo.site/t/original/i/dc6a204c35cd8a26c39b8178ccb3af98113f655ad4253cd6a9639ab3541ec56b/DIS_inner044.jpg" data-mid="117910770" border="0" alt="Data in Space, Power BI Mobile, &quot;ghost&quot; report card in pinning view." data-caption="Data in Space, Power BI Mobile, &quot;ghost&quot; report card in pinning view." src="https://freight.cargo.site/w/1000/i/dc6a204c35cd8a26c39b8178ccb3af98113f655ad4253cd6a9639ab3541ec56b/DIS_inner044.jpg" /> <img width="2532" height="1170" width_o="2532" height_o="1170" data-src="https://freight.cargo.site/t/original/i/ea9d2f32a9c54a30b8fc1f1cdc367c1f01fe8f0f8606052150a19c43537a2d38/DIS_inner011.jpg" data-mid="117910766" border="0" src="https://freight.cargo.site/w/1000/i/ea9d2f32a9c54a30b8fc1f1cdc367c1f01fe8f0f8606052150a19c43537a2d38/DIS_inner011.jpg" /> <img width="2532" height="1170" width_o="2532" height_o="1170" data-src="https://freight.cargo.site/t/original/i/e8db2c7b3dbb8b6cdba23da1da10d5748e90623b04e32aeb8b15defb5729b618/DIS_inner022.jpg" data-mid="117910767" border="0" src="https://freight.cargo.site/w/1000/i/e8db2c7b3dbb8b6cdba23da1da10d5748e90623b04e32aeb8b15defb5729b618/DIS_inner022.jpg" /> <img width="2431" height="1123" width_o="2431" height_o="1123" data-src="https://freight.cargo.site/t/original/i/f97d15524292c68a57b9d2f2bd7d9563a8350741e08fa5775dd44d6118fbf67d/DIS_inner033.jpg" data-mid="117910768" border="0" src="https://freight.cargo.site/w/1000/i/f97d15524292c68a57b9d2f2bd7d9563a8350741e08fa5775dd44d6118fbf67d/DIS_inner033.jpg" /> <img width="2380" height="1100" width_o="2380" height_o="1100" data-src="https://freight.cargo.site/t/original/i/dc6a204c35cd8a26c39b8178ccb3af98113f655ad4253cd6a9639ab3541ec56b/DIS_inner044.jpg" data-mid="117910770" border="0" src="https://freight.cargo.site/w/1000/i/dc6a204c35cd8a26c39b8178ccb3af98113f655ad4253cd6a9639ab3541ec56b/DIS_inner044.jpg" /> Data in Space is an augmented reality experience that enables users to make better decisions based on data and insights outside of the office boundaries, in places, and next to objects/people in the physical world.It does so through the ability to bind data to a real-world object as a digital twin, place and save it in the physical space.&nbsp; Data in Space POC Demo flow: Pinning and scanning Covid-19 vaccine data to track vaccination progress in the Seattle vaccination center. Vision and MotivationOne of Power BI key objectives is to help customers drive a data culture, where every employee in the organization has an immediate access to data and insights and is making decisions based on facts versus opinions. In mobile, this vision can be achieved through new technologies and capabilities like Augmented Reality. ︎ Augmented Reality in BusinessAugmented Reality in mobile devices has matured and gained serious momentum in the last years. Utilizing this technology to empower the Power BI user seems like a natural extension to further the product vision.(Read “10 Augmented Reality Trends in 2021: The future is Here” for more insights). <img width="200" height="164" width_o="200" height_o="164" data-src="https://freight.cargo.site/t/original/i/a8ed1cf158b206b477d8f686ef9c6c930f481416bc505aa22f94647697c2be12/Pinning01small.gif" data-mid="117639338" border="0" alt="&quot;Pinning&quot; a report in space. Dragging, scaling and rotating to adjust position." data-caption="&quot;Pinning&quot; a report in space. Dragging, scaling and rotating to adjust position." src="https://freight.cargo.site/w/200/i/a8ed1cf158b206b477d8f686ef9c6c930f481416bc505aa22f94647697c2be12/Pinning01small.gif" /> <img width="182" height="200" width_o="182" height_o="200" data-src="https://freight.cargo.site/t/original/i/5ef9c8ef6af1151b3e409970d6238bb26df06d787e58667ff8f5bbc7df61032b/Scaning01small.gif" data-mid="117639339" border="0" alt="&quot;Scanning&quot; for reports in space. The radar displays located nearby reports." data-caption="&quot;Scanning&quot; for reports in space. The radar displays located nearby reports." src="https://freight.cargo.site/w/182/i/5ef9c8ef6af1151b3e409970d6238bb26df06d787e58667ff8f5bbc7df61032b/Scaning01small.gif" /> ︎ Use CasesData in Space The definition process began with the collection of user research, customers studies and potential needs/scenarios, upon which we could build flows and solidify requirements.We approached companies from different industries: Retail, Manufacturing, Construction, Healthcare, etc... and asked questions like: Does it make sense? What is the addressable market? What are the business scenarios?&nbsp; <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/65d91a36583d4feffd81c3ab14c0e8463ac30201f1cb401ce893f732496fbfc9/DIS_Innerresearch01.png" data-mid="117535940" border="0" alt="Retail industry &quot;Data in Space&quot; use case. Taken from Microsoft internal research." data-caption="Retail industry &quot;Data in Space&quot; use case. Taken from Microsoft internal research." src="https://freight.cargo.site/w/1000/i/65d91a36583d4feffd81c3ab14c0e8463ac30201f1cb401ce893f732496fbfc9/DIS_Innerresearch01.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/08fad9b4cf85bc880a80a2437e3b748a5cadce5f0438c0a1e024870d556f66b1/DIS_Innerresearch02.png" data-mid="117535941" border="0" alt="Manufacturing industry &quot;Data in Space&quot; use case. Taken from Microsoft internal research, 01." data-caption="Manufacturing industry &quot;Data in Space&quot; use case. Taken from Microsoft internal research, 01." src="https://freight.cargo.site/w/1000/i/08fad9b4cf85bc880a80a2437e3b748a5cadce5f0438c0a1e024870d556f66b1/DIS_Innerresearch02.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/27401d537dc1815b6857d7d061393b0ae83d8c8d4e7ca5fead2b04b74cfbeede/DIS_Innerresearch03.png" data-mid="117535942" border="0" alt="Manufacturing industry &quot;Data in Space&quot; use case. Taken from Microsoft internal research, 02." data-caption="Manufacturing industry &quot;Data in Space&quot; use case. Taken from Microsoft internal research, 02." src="https://freight.cargo.site/w/1000/i/27401d537dc1815b6857d7d061393b0ae83d8c8d4e7ca5fead2b04b74cfbeede/DIS_Innerresearch03.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/2121ec198ad1d25508d0fec0a29a90af323eb974bea1a138d53d4d384be39a87/DIS_Innerresearch04.png" data-mid="117535943" border="0" alt="Healthcare industry &quot;Data in Space&quot; use case. Taken from Microsoft internal research." data-caption="Healthcare industry &quot;Data in Space&quot; use case. Taken from Microsoft internal research." src="https://freight.cargo.site/w/1000/i/2121ec198ad1d25508d0fec0a29a90af323eb974bea1a138d53d4d384be39a87/DIS_Innerresearch04.png" /> Key takeawaysThe business need for ׳Data in Space׳ exists.Many customer scenarios require near real-time data.Two personas emerged:The creator who&nbsp;pins the reports in the space.&nbsp; The consumer who&nbsp;scans and discovers the items in space. ︎ Flow ConceptualizationCore experience elements of ׳Data in Space׳, were rooted in real customers needs,&nbsp; which guided me through the conceptualization of the basic ׳Pinning׳ and ׳Scanning׳ flows. <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/2ccb2664b820a1fd319fa6d014c7e39a194421e7c8df961f47b72096c30a7cb8/DIS_InnerPinningFlow01.png" data-mid="117572946" border="0" alt="&quot;Pinning&quot; experience user flow." data-caption="&quot;Pinning&quot; experience user flow." src="https://freight.cargo.site/w/1000/i/2ccb2664b820a1fd319fa6d014c7e39a194421e7c8df961f47b72096c30a7cb8/DIS_InnerPinningFlow01.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/83927f6ebaa7b79596019735e4a14af89eface250b51c46d7e0e40eeb54e7381/DIS_InnerPinningFlow02.png" data-mid="117572947" border="0" alt="&quot;Pinning&quot; experience user flow, steps description." data-caption="&quot;Pinning&quot; experience user flow, steps description." src="https://freight.cargo.site/w/1000/i/83927f6ebaa7b79596019735e4a14af89eface250b51c46d7e0e40eeb54e7381/DIS_InnerPinningFlow02.png" /> The creator, pins the reports in the relevant space. For instance, the assembly line manager, pins a report of the parts inventory next to its line. Later on the consumer, the assembly line worker, can scan the space to find the report and understand the inventory in context of his/hers needs. <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/9bd367c561fd0939941d61cbfdb57e81cbb34d86a33b0ad9940f8d993c09e1df/DIS_InnerScanningFlow01.png" data-mid="117572948" border="0" alt="&quot;Scanning&quot; experience user flow." data-caption="&quot;Scanning&quot; experience user flow." src="https://freight.cargo.site/w/1000/i/9bd367c561fd0939941d61cbfdb57e81cbb34d86a33b0ad9940f8d993c09e1df/DIS_InnerScanningFlow01.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/902c00e5f3c1a5664861439774c6e9e34ba4615a0715a64200f7d7a32a794430/DIS_InnerScanningFlow02.png" data-mid="117572949" border="0" alt="&quot;Scanning&quot; experience user flow, steps description." data-caption="&quot;Scanning&quot; experience user flow, steps description." src="https://freight.cargo.site/w/1000/i/902c00e5f3c1a5664861439774c6e9e34ba4615a0715a64200f7d7a32a794430/DIS_InnerScanningFlow02.png" /> ︎PinningData in Space Data in Space Pinning flow: Placing a report in a Gym. The user places the “Cardio” report next to the cardio equipment in the Gym. When ׳Pinning׳ in space, the user places, adjusts and saves the reports in the physical location. This is a playground for the user to interact with the 3D report object and save it in the space. The pinning experience should both convey its abilities and guide the user to successful task completion. These key elements followed me throughout the design process of pinning&nbsp;report card, layout and&nbsp;user flow. Report CardThe report card in the ׳Pinning׳ mode, is a representation of the data item that will appear in the space after saving its location - ׳Ghost׳ appearance. The card can be adjusted (drag, scale, rotate) by the user and then saved to the space.&nbsp;In order to achieve an intuitive experience, the card visualization had to convey these functionalities. <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/bb90cc92994a8b37a424139cc6de44a626f3051756c0b14fefa13969e07ec458/DIS_InnerPinningCard.png" data-mid="117545903" border="0" alt="&quot;Pinning&quot; mode card appearance breakdown." data-caption="&quot;Pinning&quot; mode card appearance breakdown." src="https://freight.cargo.site/w/1000/i/bb90cc92994a8b37a424139cc6de44a626f3051756c0b14fefa13969e07ec458/DIS_InnerPinningCard.png" /> <img width="1000" height="2169" width_o="1000" height_o="2169" data-src="https://freight.cargo.site/t/original/i/a6775c604447e98bde791b594514e0a5a54d235979c939f3d376e63936013bde/DIS_PinningChallenge02.png" data-mid="117597968" border="0" alt="&quot;Pinning&quot; mode screenshot from a test of the POC build, portrait." data-caption="&quot;Pinning&quot; mode screenshot from a test of the POC build, portrait." src="https://freight.cargo.site/w/1000/i/a6775c604447e98bde791b594514e0a5a54d235979c939f3d376e63936013bde/DIS_PinningChallenge02.png" /> <img width="2000" height="924" width_o="2000" height_o="924" data-src="https://freight.cargo.site/t/original/i/36ecb0acff3a83a67515e1b5006ee134d97a520c9ab68c2264da2083a3be38a6/DIS_PinningPic02.png" data-mid="117572294" border="0" alt="&quot;Pinning&quot; mode screenshot from a test of the POC build, landscape." data-caption="&quot;Pinning&quot; mode screenshot from a test of the POC build, landscape." src="https://freight.cargo.site/w/1000/i/36ecb0acff3a83a67515e1b5006ee134d97a520c9ab68c2264da2083a3be38a6/DIS_PinningPic02.png" /> Pinning LayoutWhen ׳Pinning׳, the user is presented with a graphical layer in the physical space: ׳Ghost׳ card of the report Grid for visual mapping of the surfaces in the space Buttons, banners and a progress bar for user guidance <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/199e741b69588414889648df87ee539f6b17e29d470d73d305412e2156bd7a13/DIS_InnerPinningLayout01.png" data-mid="117539881" border="0" alt="&quot;Pinning&quot; mode layout elements breakdown." data-caption="&quot;Pinning&quot; mode layout elements breakdown." src="https://freight.cargo.site/w/1000/i/199e741b69588414889648df87ee539f6b17e29d470d73d305412e2156bd7a13/DIS_InnerPinningLayout01.png" /> <img width="1848" height="4000" width_o="1848" height_o="4000" data-src="https://freight.cargo.site/t/original/i/8eaf31a28def14d3755dff61b4797e81ae4327bf18a342eeef32a437c1162bd6/DIS_PinningPic01_2.png" data-mid="117572537" border="0" alt="&quot;Pinning&quot; mode layout screenshot from a test of the POC build, portrait." data-caption="&quot;Pinning&quot; mode layout screenshot from a test of the POC build, portrait." src="https://freight.cargo.site/w/1000/i/8eaf31a28def14d3755dff61b4797e81ae4327bf18a342eeef32a437c1162bd6/DIS_PinningPic01_2.png" /> <img width="2168" height="1000" width_o="2168" height_o="1000" data-src="https://freight.cargo.site/t/original/i/083051dafd45f0b4f4288a779f8b4e188c20858916e187c2fab4490b8ff098fa/DIS_PinningChallenge03-.png" data-mid="117599273" border="0" alt="&quot;Pinning&quot; mode layout screenshot from a test of the POC build, landscape." data-caption="&quot;Pinning&quot; mode layout screenshot from a test of the POC build, landscape." src="https://freight.cargo.site/w/1000/i/083051dafd45f0b4f4288a779f8b4e188c20858916e187c2fab4490b8ff098fa/DIS_PinningChallenge03-.png" /> Pinning FlowThe user enters the ׳Pinning׳ mode through the report he/she wants to ׳pin׳. A preview screen of the report card is shown - the user can edit the state of the card, change the name and decide whether filters should be applied in the pinned report.׳Pin in Space׳ button&nbsp; opens the device camera and displays the pinning graphical layer in the physical space.&nbsp; <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/da5d2a62635acda8682b150f725d688bc8cd1a492a401a32ec69bc8091a45862/DIS_InnerPinningFlow03.png" data-mid="117593403" border="0" alt="Entering the &quot;Pinning&quot; mode by tapping the &quot;Pin&quot; button in the report header." data-caption="Entering the &quot;Pinning&quot; mode by tapping the &quot;Pin&quot; button in the report header." src="https://freight.cargo.site/w/1000/i/da5d2a62635acda8682b150f725d688bc8cd1a492a401a32ec69bc8091a45862/DIS_InnerPinningFlow03.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/cc8063e823362600487d24b40664fb97ddb3dce8dc165b18c748175825e35356/DIS_InnerPinningFlow04.png" data-mid="117593404" border="0" alt="Preview screen of the report card." data-caption="Preview screen of the report card." src="https://freight.cargo.site/w/1000/i/cc8063e823362600487d24b40664fb97ddb3dce8dc165b18c748175825e35356/DIS_InnerPinningFlow04.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/5a4bbb0f677f5c8b82bf42e979f4d1fd543e062f603c4451cd69e49b7a2d5f2d/DIS_InnerPinningFlow05.png" data-mid="117593406" border="0" alt="Starting the &quot;Pinning&quot; process by mapping the surfaces in the area." data-caption="Starting the &quot;Pinning&quot; process by mapping the surfaces in the area." src="https://freight.cargo.site/w/1000/i/5a4bbb0f677f5c8b82bf42e979f4d1fd543e062f603c4451cd69e49b7a2d5f2d/DIS_InnerPinningFlow05.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/84400cf188e48eeba54c794909511c53f11527876433a8f574e6d69353de9766/DIS_InnerPinningFlow06.png" data-mid="117593408" border="0" alt="&quot;Ghost&quot; card appears once the surfaces are mapped." data-caption="&quot;Ghost&quot; card appears once the surfaces are mapped." src="https://freight.cargo.site/w/1000/i/84400cf188e48eeba54c794909511c53f11527876433a8f574e6d69353de9766/DIS_InnerPinningFlow06.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/ac262a6208b95bd57b3ef0f8930419aaa791809574148bd1f7e7871855b7f917/DIS_InnerPinningFlow07.png" data-mid="117593409" border="0" alt="User can adjust the card by dragging to another loaction, rotating ans scaling, 01." data-caption="User can adjust the card by dragging to another loaction, rotating ans scaling, 01." src="https://freight.cargo.site/w/1000/i/ac262a6208b95bd57b3ef0f8930419aaa791809574148bd1f7e7871855b7f917/DIS_InnerPinningFlow07.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/f7778ecc99deb53de1884281dca7c0444490f13a74a35f9b554b3403f91d57b4/DIS_InnerPinningFlow08.png" data-mid="117593410" border="0" alt="&quot;User can adjust the card by dragging to another loaction, rotating ans scaling, 02." data-caption="&quot;User can adjust the card by dragging to another loaction, rotating ans scaling, 02." src="https://freight.cargo.site/w/1000/i/f7778ecc99deb53de1884281dca7c0444490f13a74a35f9b554b3403f91d57b4/DIS_InnerPinningFlow08.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/250a2017bae304c5101e63751e8e7c0a846358b13ec10bfef52bcbebfe18c09d/DIS_InnerPinningFlow09.png" data-mid="117593411" border="0" alt="Pin in Space&quot; button saves the location of the card in the physical space." data-caption="Pin in Space&quot; button saves the location of the card in the physical space." src="https://freight.cargo.site/w/1000/i/250a2017bae304c5101e63751e8e7c0a846358b13ec10bfef52bcbebfe18c09d/DIS_InnerPinningFlow09.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/76aad541469a3ee3a11b42d49b9ca8a1b22d8b21b2f55c2fb5c64e649e5d17ad/DIS_InnerPinningFlow10.png" data-mid="117593412" border="0" alt="Card appearance changes to opaque after saving it." data-caption="Card appearance changes to opaque after saving it." src="https://freight.cargo.site/w/1000/i/76aad541469a3ee3a11b42d49b9ca8a1b22d8b21b2f55c2fb5c64e649e5d17ad/DIS_InnerPinningFlow10.png" /> <img width="509" height="1099" width_o="509" height_o="1099" data-src="https://freight.cargo.site/t/original/i/3493657acad0060b3756f53e00b62025a2281e4aae6fcc64b667c0811ab4170c/DIS_vPresent_pinning_GIF.gif" data-mid="117593531" border="0" alt="&quot;Pinning&quot; flow scenario." data-caption="&quot;Pinning&quot; flow scenario." src="https://freight.cargo.site/w/509/i/3493657acad0060b3756f53e00b62025a2281e4aae6fcc64b667c0811ab4170c/DIS_vPresent_pinning_GIF.gif" /> <img width="184" height="361" width_o="184" height_o="361" data-src="https://freight.cargo.site/t/original/i/de15f44e430d7657f6928cb76e3849c0dab43ad147dee90605b09d067e761a89/DIS_Pinning02small.gif" data-mid="117715892" border="0" alt="&quot;Pin in Space&quot; navigates the user from the card preview screen to the &quot;Pinning&quot; mode." data-caption="&quot;Pin in Space&quot; navigates the user from the card preview screen to the &quot;Pinning&quot; mode." src="https://freight.cargo.site/w/184/i/de15f44e430d7657f6928cb76e3849c0dab43ad147dee90605b09d067e761a89/DIS_Pinning02small.gif" /> <img width="163" height="319" width_o="163" height_o="319" data-src="https://freight.cargo.site/t/original/i/25a9b56b997c2460486cb7ccc446474605cea517346ca46dce98261a515c8919/DIS_Pinning03small.gif" data-mid="117715893" border="0" alt="Scaling, dragging the rotating the &quot;ghost&quot; card in &quot;Pinning&quot; mode." data-caption="Scaling, dragging the rotating the &quot;ghost&quot; card in &quot;Pinning&quot; mode." src="https://freight.cargo.site/w/163/i/25a9b56b997c2460486cb7ccc446474605cea517346ca46dce98261a515c8919/DIS_Pinning03small.gif" /> <img width="163" height="319" width_o="163" height_o="319" data-src="https://freight.cargo.site/t/original/i/278c7ee1876836cd1a9c38f9bbb58f417871ce7882248319cebe680e69f2a38e/DIS_Pinning04small.gif" data-mid="117715894" border="0" alt="Saving the location of the card in the physical space, makes the &quot;ghost&quot; card permanent." data-caption="Saving the location of the card in the physical space, makes the &quot;ghost&quot; card permanent." src="https://freight.cargo.site/w/163/i/278c7ee1876836cd1a9c38f9bbb58f417871ce7882248319cebe680e69f2a38e/DIS_Pinning04small.gif" /> ︎ScanningData in Space Data in Space Scanning flow: Scanning the Gym space to find reports in the relevant areas (free weight, cardio, etc..). When ׳Scanning׳ in space, the user searches for the saved reports in the physical area. Successful orientation and understanding of the scanning process are imperative for user success. The scanning experience should guide the users to the location of the nearby saved reports and carry them through until finding the relevant one. These principles were in mind throughout the design process of the scanning report card, layout and user flow. Report CardWhile the report card in the ׳Pinning׳ mode is editable, in the ׳Scanning׳ mode, it is the representation of the report itself. It displays the most updated data, in the report screenshot, refresh time and applied filters. The card is a 3D opaque object that invites the user to tap and interact with it. <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/9a17db264825a1e15e67eea7046ce719642fff1ada09d62a0182419a006128fd/DIS_InnerScanningCard.png" data-mid="117545924" border="0" alt="&quot;Scanning&quot; mode card appearance breakdown." data-caption="&quot;Scanning&quot; mode card appearance breakdown." src="https://freight.cargo.site/w/1000/i/9a17db264825a1e15e67eea7046ce719642fff1ada09d62a0182419a006128fd/DIS_InnerScanningCard.png" /> <img width="1000" height="2168" width_o="1000" height_o="2168" data-src="https://freight.cargo.site/t/original/i/8482d6a52c1d5ff3b9ffd538a197d7e95cdfd1d25af79b309e7755a76d3c7b1b/DIS_ScanningChallenge04.png" data-mid="117599723" border="0" alt="&quot;Scanning&quot; mode layout screenshot from a test of the POC build, portrait." data-caption="&quot;Scanning&quot; mode layout screenshot from a test of the POC build, portrait." src="https://freight.cargo.site/w/1000/i/8482d6a52c1d5ff3b9ffd538a197d7e95cdfd1d25af79b309e7755a76d3c7b1b/DIS_ScanningChallenge04.png" /> <img width="2164" height="1000" width_o="2164" height_o="1000" data-src="https://freight.cargo.site/t/original/i/a2ce5081ea96511e6d3f9e9251c1e24b3151d7e8a4f1b4fb7affdf646c222b1f/DIS_ScanningCard01.png" data-mid="117601599" border="0" alt="&quot;Scanning&quot; mode layout screenshot from a test of the POC build, landscape." data-caption="&quot;Scanning&quot; mode layout screenshot from a test of the POC build, landscape." src="https://freight.cargo.site/w/1000/i/a2ce5081ea96511e6d3f9e9251c1e24b3151d7e8a4f1b4fb7affdf646c222b1f/DIS_ScanningCard01.png" /> Scanning LayoutWhen ׳Scanning׳, the user is guided to find the nearby pinned reports through a graphical layer in the physical space: 3D card of the reportGrid for visual mapping of the surfaces in the space Banners and a progress bar for user guidenceRadar that displays the reports׳ location in the space - each dot in the radar represents a report found in the nearby area. The radar assists to the orientation in the physical environment.&nbsp; <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/30ecc2212137dbe1c633cecfb4eb4705c779e623370d7a90c37d95bc3853f67c/DIS_InnerScanningLayout01.png" data-mid="117539884" border="0" alt="&quot;Scanning&quot; mode layout elements breakdown." data-caption="&quot;Scanning&quot; mode layout elements breakdown." src="https://freight.cargo.site/w/1000/i/30ecc2212137dbe1c633cecfb4eb4705c779e623370d7a90c37d95bc3853f67c/DIS_InnerScanningLayout01.png" /> <img width="750" height="1624" width_o="750" height_o="1624" data-src="https://freight.cargo.site/t/original/i/08744b4a73c853459ebd15ca439b885d00012755bba04b0527b5550a3c0a9924/DIS_DcanningLayout01.png" data-mid="117635682" border="0" alt="&quot;Scanning&quot; mode layout screenshot from a test of the POC build, portrait." data-caption="&quot;Scanning&quot; mode layout screenshot from a test of the POC build, portrait." src="https://freight.cargo.site/w/750/i/08744b4a73c853459ebd15ca439b885d00012755bba04b0527b5550a3c0a9924/DIS_DcanningLayout01.png" /> <img width="1624" height="750" width_o="1624" height_o="750" data-src="https://freight.cargo.site/t/original/i/43c89171396604505bd7b491aacad98544e35f590eb1c479211d57aca17caf33/DIS_DcanningLayout02.png" data-mid="117636965" border="0" alt="&quot;Scanning&quot; mode layout screenshot from a test of the POC build, landscape." data-caption="&quot;Scanning&quot; mode layout screenshot from a test of the POC build, landscape." src="https://freight.cargo.site/w/1000/i/43c89171396604505bd7b491aacad98544e35f590eb1c479211d57aca17caf33/DIS_DcanningLayout02.png" /> Scanning FlowThe user enters the ׳Scanning׳ mode by opening the app camera. A mapping process of the environment is initiated. When the surfaces are mapped and recognized, the reports in that physical area (and nearby areas) are displayed to the user both in the camera view and in the radar as dots. Tapping one of the cards, opens the report it represents. <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/ec65e6571b74e8943729f19a7f1bdd70dd899d405cd047962fa21ef2da8d9216/DIS_InnerScanningFlow03.png" data-mid="117593560" border="0" alt="Entering the &quot;Scanning&quot; mode by tapping the &quot;Camera&quot; button in the app header." data-caption="Entering the &quot;Scanning&quot; mode by tapping the &quot;Camera&quot; button in the app header." src="https://freight.cargo.site/w/1000/i/ec65e6571b74e8943729f19a7f1bdd70dd899d405cd047962fa21ef2da8d9216/DIS_InnerScanningFlow03.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/8faa214deb7d623eac0a468ef594d0efdd2970636c59f5c4aaa8d6adace01374/DIS_InnerScanningFlow04.png" data-mid="117593561" border="0" alt="Mapping the surfaces in the physical area, 01." data-caption="Mapping the surfaces in the physical area, 01." src="https://freight.cargo.site/w/1000/i/8faa214deb7d623eac0a468ef594d0efdd2970636c59f5c4aaa8d6adace01374/DIS_InnerScanningFlow04.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/2b09dddbfb32700fe591a0a4c1d9c619192baea4cf17aa2cd5581849de010016/DIS_InnerScanningFlow05.png" data-mid="117593562" border="0" alt="Mapping the surfaces in the physical area, 02." data-caption="Mapping the surfaces in the physical area, 02." src="https://freight.cargo.site/w/1000/i/2b09dddbfb32700fe591a0a4c1d9c619192baea4cf17aa2cd5581849de010016/DIS_InnerScanningFlow05.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/51139667a9a9c81e6f3d25abeca2c9f4a9bffd12a77bdb247b795eb0ae47076a/DIS_InnerScanningFlow06.png" data-mid="117593563" border="0" alt="Mapping the surfaces in the physical area, 03." data-caption="Mapping the surfaces in the physical area, 03." src="https://freight.cargo.site/w/1000/i/51139667a9a9c81e6f3d25abeca2c9f4a9bffd12a77bdb247b795eb0ae47076a/DIS_InnerScanningFlow06.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/9f4d70cdeaa10bf3597d014148ab0adbce6717135cef98fe2b289dbb5f43b4ab/DIS_InnerScanningFlow07.png" data-mid="117593564" border="0" alt=" Once the surfaces are recognized, the reports in the area are displayed in the camera view, 01." data-caption=" Once the surfaces are recognized, the reports in the area are displayed in the camera view, 01." src="https://freight.cargo.site/w/1000/i/9f4d70cdeaa10bf3597d014148ab0adbce6717135cef98fe2b289dbb5f43b4ab/DIS_InnerScanningFlow07.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/28078edb61fa46e6a95e088912611e3e045d4e94a00d3d8bdd59d0c5984b6c15/DIS_InnerScanningFlow08.png" data-mid="117593565" border="0" alt=" Once the surfaces are recognized, the reports in the area are displayed in the camera view, 02." data-caption=" Once the surfaces are recognized, the reports in the area are displayed in the camera view, 02." src="https://freight.cargo.site/w/1000/i/28078edb61fa46e6a95e088912611e3e045d4e94a00d3d8bdd59d0c5984b6c15/DIS_InnerScanningFlow08.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/f181977440968b95cb91ac7f85559181b67cd359adf9c135b58d2443e233dafb/DIS_InnerScanningFlow09.png" data-mid="117593566" border="0" alt="Tapping the card in the space, opens the report it represents." data-caption="Tapping the card in the space, opens the report it represents." src="https://freight.cargo.site/w/1000/i/f181977440968b95cb91ac7f85559181b67cd359adf9c135b58d2443e233dafb/DIS_InnerScanningFlow09.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/dd2a2946402ed764eae1eb21efbff37bd240770fcceaa76892623131dd84780c/DIS_InnerScanningFlow10.png" data-mid="117593567" border="0" alt="Opening the report, the user can now interact with the data." data-caption="Opening the report, the user can now interact with the data." src="https://freight.cargo.site/w/1000/i/dd2a2946402ed764eae1eb21efbff37bd240770fcceaa76892623131dd84780c/DIS_InnerScanningFlow10.png" /> <img width="508" height="1100" width_o="508" height_o="1100" data-src="https://freight.cargo.site/t/original/i/d708cb8b491b1128191e6ebed0a47da7376a1684de84c4615ce3af94b64d9178/DIS_vPresent_scaning_GIF.gif" data-mid="117593632" border="0" alt="&quot;Scanning&quot; flow scenario." data-caption="&quot;Scanning&quot; flow scenario." src="https://freight.cargo.site/w/508/i/d708cb8b491b1128191e6ebed0a47da7376a1684de84c4615ce3af94b64d9178/DIS_vPresent_scaning_GIF.gif" /> <img width="121" height="221" width_o="121" height_o="221" data-src="https://freight.cargo.site/t/original/i/012d73f4595c694e272e9487329a1a2d903fbb632e4ac96b6b4fdf69d4cb7402/DIS_Scanning001.gif" data-mid="117661673" border="0" alt="&quot;Scanning&quot; in space to discover nearby reports, 01." data-caption="&quot;Scanning&quot; in space to discover nearby reports, 01." src="https://freight.cargo.site/w/121/i/012d73f4595c694e272e9487329a1a2d903fbb632e4ac96b6b4fdf69d4cb7402/DIS_Scanning001.gif" /> <img width="185" height="401" width_o="185" height_o="401" data-src="https://freight.cargo.site/t/original/i/cd555a693f92f8aee56f88186a439b169dd73ed87d75ae340c7d5f472c627354/DIS_Scanning02.gif" data-mid="117660926" border="0" alt="&quot;Scanning&quot; in space to discover nearby reports, 02." data-caption="&quot;Scanning&quot; in space to discover nearby reports, 02." src="https://freight.cargo.site/w/185/i/cd555a693f92f8aee56f88186a439b169dd73ed87d75ae340c7d5f472c627354/DIS_Scanning02.gif" /> ︎OpportunitiesData in Space <img width="2000" height="924" width_o="2000" height_o="924" data-src="https://freight.cargo.site/t/original/i/33873dd8e0a72bc5adf5fc34156188d5aba38a29e2726dc298c97f257bc6e873/DIS_bloopers01.png" data-mid="117665233" border="0" data-scale="72" alt="Report card in &quot;Pinning&quot; mode. Test build with multiple appearances of the same card." data-caption="Report card in &quot;Pinning&quot; mode. Test build with multiple appearances of the same card." src="https://freight.cargo.site/w/1000/i/33873dd8e0a72bc5adf5fc34156188d5aba38a29e2726dc298c97f257bc6e873/DIS_bloopers01.png" /> <img width="2436" height="1125" width_o="2436" height_o="1125" data-src="https://freight.cargo.site/t/original/i/7893a4526d667c8cba44a0d285e39f40fcc344ce505c2fce107db0feaf3541eb/DIS_bloopers02.PNG" data-mid="117803021" border="0" alt="Report card in &quot;Scanning&quot; mode. Test build with multiple appearances of the same card." data-caption="Report card in &quot;Scanning&quot; mode. Test build with multiple appearances of the same card." src="https://freight.cargo.site/w/1000/i/7893a4526d667c8cba44a0d285e39f40fcc344ce505c2fce107db0feaf3541eb/DIS_bloopers02.PNG" /> Creating the ׳Data in Space׳ experience was a journey of discovering a new technology, learning how to leverage its limitations and fulfilling its potential by breathing into its real-life needs.After experimenting with ׳Spatial Anchoring׳ (the technology ׳Data in Space׳ is based upon), it was clear that the challenges the experience should address are user understanding of a new interaction model and user guidance for easy adoption. <img width="747" height="500" width_o="747" height_o="500" data-src="https://freight.cargo.site/t/original/i/62ba6c704169ef34aa9109ed9b575c32dd633dae9423ce8e7b4665dfa4f27cb5/DIS_ASA01.png" data-mid="117807607" border="0" alt="Spatial Anchoring, point cloud anchoring simulation." data-caption="Spatial Anchoring, point cloud anchoring simulation." src="https://freight.cargo.site/w/747/i/62ba6c704169ef34aa9109ed9b575c32dd633dae9423ce8e7b4665dfa4f27cb5/DIS_ASA01.png" /> <img width="1397" height="820" width_o="1397" height_o="820" data-src="https://freight.cargo.site/t/original/i/2287f979305f6317d0a9db973513d286afc46d15c70770767069304fea0582a9/DIS_ASA02.png" data-mid="117807987" border="0" alt="Spatial Anchoring, an environment and its derived sparse point cloud simulation." data-caption="Spatial Anchoring, an environment and its derived sparse point cloud simulation." src="https://freight.cargo.site/w/1000/i/2287f979305f6317d0a9db973513d286afc46d15c70770767069304fea0582a9/DIS_ASA02.png" /> <img width="1200" height="572" width_o="1200" height_o="572" data-src="https://freight.cargo.site/t/original/i/1270e4ccdf63709cea2ab57b20657ffda997f8fd11840bb1f58967fa4e242371/DIS_ASA04.png" data-mid="117807610" border="0" alt="Spatial Anchoring, an example of a spatial mapping mesh covering a room." data-caption="Spatial Anchoring, an example of a spatial mapping mesh covering a room." src="https://freight.cargo.site/w/1000/i/1270e4ccdf63709cea2ab57b20657ffda997f8fd11840bb1f58967fa4e242371/DIS_ASA04.png" /> <img width="400" height="225" width_o="400" height_o="225" data-src="https://freight.cargo.site/t/original/i/dc3ba0925158369e2a2a8cf4c10d7a052fab69d1c613d0d7629312c1a41d2488/DIS_ASA03.gif" data-mid="117807609" border="0" alt="Spatial Anchoring, flow simulation." data-caption="Spatial Anchoring, flow simulation." src="https://freight.cargo.site/w/400/i/dc3ba0925158369e2a2a8cf4c10d7a052fab69d1c613d0d7629312c1a41d2488/DIS_ASA03.gif" /> User Understanding ׳Data in Space׳ is a new type of interaction for the Power BI Mobile users. To achieve a successful journey, users need to understand how to interact with the report card in the physical space, and comprehend that the surfaces in the camera POV are mapped and a part of the experience.&nbsp; To that extent, the report card was designed to indicate the types of interactions that can be applied to it, and the opacity of the card was reduced to suggest it’s editable.&nbsp; <img width="2000" height="924" width_o="2000" height_o="924" data-src="https://freight.cargo.site/t/original/i/173365a155260bc4b07e9cc4111307e8a4cc6a00fc9449061b2e2a7583c0ee0e/DIS_bloopers07.png" data-mid="117803831" border="0" alt="Report cards with low opacity and adjustment indications (screenshot from a test build)." data-caption="Report cards with low opacity and adjustment indications (screenshot from a test build)." src="https://freight.cargo.site/w/1000/i/173365a155260bc4b07e9cc4111307e8a4cc6a00fc9449061b2e2a7583c0ee0e/DIS_bloopers07.png" /> <img width="2436" height="1125" width_o="2436" height_o="1125" data-src="https://freight.cargo.site/t/original/i/4a77839afe5d18fbf2d944f3b46e347351c18bebddc47037d2601ec3c92f439f/DIS_bloopers06.PNG" data-mid="117803827" border="0" alt="Report cards with low opacity and adjustment indications (screenshot from a test build with bugs :)." data-caption="Report cards with low opacity and adjustment indications (screenshot from a test build with bugs :)." src="https://freight.cargo.site/w/1000/i/4a77839afe5d18fbf2d944f3b46e347351c18bebddc47037d2601ec3c92f439f/DIS_bloopers06.PNG" /> <img width="433" height="200" width_o="433" height_o="200" data-src="https://freight.cargo.site/t/original/i/dfecdf6e99f02efc650e9d49fc69ca53159448f68a52803f9c2f57d4432b7ca2/DIS_PinningASA01.gif" data-mid="117814085" border="0" alt="Dragging a report card in &quot;Pinning&quot; mode." data-caption="Dragging a report card in &quot;Pinning&quot; mode." src="https://freight.cargo.site/w/433/i/dfecdf6e99f02efc650e9d49fc69ca53159448f68a52803f9c2f57d4432b7ca2/DIS_PinningASA01.gif" /> <img width="300" height="138" width_o="300" height_o="138" data-src="https://freight.cargo.site/t/original/i/bcdef495de5fe5a7642c66b8091f7ee41b74237d27d284136afc5d86f65e532e/DIS_PinningASA02.gif" data-mid="117814086" border="0" alt="Saving a report card in &quot;Pinning&quot; mode (test build with bugs)." data-caption="Saving a report card in &quot;Pinning&quot; mode (test build with bugs)." src="https://freight.cargo.site/w/300/i/bcdef495de5fe5a7642c66b8091f7ee41b74237d27d284136afc5d86f65e532e/DIS_PinningASA02.gif" /> <img width="360" height="166" width_o="360" height_o="166" data-src="https://freight.cargo.site/t/original/i/c7005b145c1a1a93e390a017184ddf76bccfd86fab4baaf7a433ade548558dcf/DIS_PinningASA03.gif" data-mid="117814087" border="0" alt="Rotating, scaling and dragging a report card in &quot;Pinning&quot; mode." data-caption="Rotating, scaling and dragging a report card in &quot;Pinning&quot; mode." src="https://freight.cargo.site/w/360/i/c7005b145c1a1a93e390a017184ddf76bccfd86fab4baaf7a433ade548558dcf/DIS_PinningASA03.gif" /> A layer of graphic dots were added to the mapped surfaces in the physical area, to visually convey that there is an immersive experience happening at this moment and to provide the users with an indication to which point in space the card is being associated. <img width="1000" height="2168" width_o="1000" height_o="2168" data-src="https://freight.cargo.site/t/original/i/7d8c5f13f8e2feca4e38f7993d8dc9e5e900df0cb30a1051d5209128dff9c156/DIS_PinningChallenge01.png" data-mid="117803842" border="0" alt="Dots grid on the mapped surfaces in the space (screenshot from a test build with multiple planes detection), 01." data-caption="Dots grid on the mapped surfaces in the space (screenshot from a test build with multiple planes detection), 01." src="https://freight.cargo.site/w/1000/i/7d8c5f13f8e2feca4e38f7993d8dc9e5e900df0cb30a1051d5209128dff9c156/DIS_PinningChallenge01.png" /> <img width="924" height="2000" width_o="924" height_o="2000" data-src="https://freight.cargo.site/t/original/i/e601cbdd521aada4cac61f0c35083e8ed9ece0f73502dbc6bc6b4c4a85238fdf/DIS_bloopers09.png" data-mid="117803838" border="0" alt="Dots grid on the mapped surfaces in the space (screenshot from a test build with multiple planes detection), 02." data-caption="Dots grid on the mapped surfaces in the space (screenshot from a test build with multiple planes detection), 02." src="https://freight.cargo.site/w/924/i/e601cbdd521aada4cac61f0c35083e8ed9ece0f73502dbc6bc6b4c4a85238fdf/DIS_bloopers09.png" /> User GuidanceAn intuitive experience, in which users can progress freely to task completion, requires clear guidance. For business users meeting an AR experience is not a matter of habit: understanding the actions they should perform and orienting in the physical space with AR should be supported by design. User guidance was a dominant aspect in the design: elements like ׳help׳ banners, progress bar, and buttons that became active in context guided the users through the ׳Pinning׳ and ׳Scanning׳ flows. <img width="3040" height="1440" width_o="3040" height_o="1440" data-src="https://freight.cargo.site/t/original/i/baa6ffb9e87e5a0cfc4d616de011a1c8a484a4f475ef8496bfe8e737c75c1c63/DIS_userguide02.jpg" data-mid="117840534" border="0" alt="Help banners, progress bar and grayed out button for user guidance of the &quot;Pinning&quot; flow." data-caption="Help banners, progress bar and grayed out button for user guidance of the &quot;Pinning&quot; flow." src="https://freight.cargo.site/w/1000/i/baa6ffb9e87e5a0cfc4d616de011a1c8a484a4f475ef8496bfe8e737c75c1c63/DIS_userguide02.jpg" /> <img width="1440" height="3040" width_o="1440" height_o="3040" data-src="https://freight.cargo.site/t/original/i/d35592d4ec72ce2eae575fe3f5ea215648333495570bd8ade703da95f3f29903/DIS_userguide01.jpg" data-mid="117840533" border="0" alt="Help banner and a progress bar for surface mapping in &quot;Scanning&quot; mode." data-caption="Help banner and a progress bar for surface mapping in &quot;Scanning&quot; mode." src="https://freight.cargo.site/w/1000/i/d35592d4ec72ce2eae575fe3f5ea215648333495570bd8ade703da95f3f29903/DIS_userguide01.jpg" /> A radar was created in the ׳Scanning׳ mode to help the users better orient in the space and find the AR objects saved in the nearby area. The radar displays a dot for every report card found in the space, colors the dots of the cards that are in the camera view, and moves with the camera movement. <img width="924" height="2000" width_o="924" height_o="2000" data-src="https://freight.cargo.site/t/original/i/024c851166d015043d50e7fdba62d8cc869e38b2a3ea58fd0069e136f0ae6137/DIS_userguide03.png" data-mid="117842865" border="0" alt="Radar in &quot;Scanning&quot; mode displays 3 reports in the space, one is in camera view." data-caption="Radar in &quot;Scanning&quot; mode displays 3 reports in the space, one is in camera view." src="https://freight.cargo.site/w/924/i/024c851166d015043d50e7fdba62d8cc869e38b2a3ea58fd0069e136f0ae6137/DIS_userguide03.png" /> <img width="2000" height="924" width_o="2000" height_o="924" data-src="https://freight.cargo.site/t/original/i/1b49dfebd7eab84c1d2b49f9b7fc13ac18e1b229e95c01164ea96548994b7ec3/DIS_userguide04.png" data-mid="117842866" border="0" alt="Radar in &quot;Scanning&quot; mode displays 3 reports in the space, 2 are in camera view." data-caption="Radar in &quot;Scanning&quot; mode displays 3 reports in the space, 2 are in camera view." src="https://freight.cargo.site/w/1000/i/1b49dfebd7eab84c1d2b49f9b7fc13ac18e1b229e95c01164ea96548994b7ec3/DIS_userguide04.png" /> ︎vNextData in Space These days I am designing the next version of ׳Data in Space׳. Insights and learnings from the POC are implemented to enhance and enrich the experience and user engagement. Public Preview of Data in Space for iOS - fresh from the oven:) Intro experience with guiding text and animation was added to the ׳Pinning׳ flow for better understanding of the interactions with the report card. <img width="750" height="1624" width_o="750" height_o="1624" data-src="https://freight.cargo.site/t/original/i/210ea2a477c0941decfe8a24b80ad96e10dba2ef28a653df82bc1ee351cff12b/DIS_vNext_improved03.png" data-mid="117894576" border="0" alt="Intro carousel in the new &quot;Pinning&quot; mode. Guidance how to scale the 3D card." data-caption="Intro carousel in the new &quot;Pinning&quot; mode. Guidance how to scale the 3D card." src="https://freight.cargo.site/w/750/i/210ea2a477c0941decfe8a24b80ad96e10dba2ef28a653df82bc1ee351cff12b/DIS_vNext_improved03.png" /> The messages in the guiding banners were improved and icons were added to enhance understanding of the instruction in the banner. <img width="750" height="1624" width_o="750" height_o="1624" data-src="https://freight.cargo.site/t/original/i/e5712776b33e46ce86b9eff5f0849d6f475a537d74f4e33f3e1caf1b97ec7f6c/DIS_vNext_improved01.png" data-mid="117894574" border="0" alt="Richer guidance banner with icons and improved messages." data-caption="Richer guidance banner with icons and improved messages." src="https://freight.cargo.site/w/750/i/e5712776b33e46ce86b9eff5f0849d6f475a537d74f4e33f3e1caf1b97ec7f6c/DIS_vNext_improved01.png" /> While&nbsp;׳Pinning׳, the user can now see other saved report cards in the space. In the previous version, users could see all the reports in the space while scanning. This is a major enhancement that helps the users ׳pin׳ cards in relation to other cards and avoid placing them one on top of another. <img width="750" height="1624" width_o="750" height_o="1624" data-src="https://freight.cargo.site/t/original/i/73bbf5b6085f548ed19849403747fdff7d02583c6a3f8a996df978f6e1ff0ac6/DIS_vNext_improved02.png" data-mid="117894575" border="0" alt="Other cards are visible while pinning a new card." data-caption="Other cards are visible while pinning a new card." src="https://freight.cargo.site/w/750/i/73bbf5b6085f548ed19849403747fdff7d02583c6a3f8a996df978f6e1ff0ac6/DIS_vNext_improved02.png" /> <img width="984" height="2120" width_o="984" height_o="2120" data-src="https://freight.cargo.site/t/original/i/6f133e3062151fd9beb10fb166a0918b8b27ab7c48d6b5203fbb8ebccc4212c3/DIS_bloopers04.png" data-mid="117803821" border="0" alt="Cards on top of each other in the previous version, 01." data-caption="Cards on top of each other in the previous version, 01." src="https://freight.cargo.site/w/984/i/6f133e3062151fd9beb10fb166a0918b8b27ab7c48d6b5203fbb8ebccc4212c3/DIS_bloopers04.png" /> <img width="2532" height="1170" width_o="2532" height_o="1170" data-src="https://freight.cargo.site/t/original/i/a3d4298f076ea35fdb0562c9c92f3359018587e70ca2a322fe7bc1ebafede68e/DIS_bloopers05.PNG" data-mid="117803824" border="0" alt="Cards on top of each other in the previous version, 02." data-caption="Cards on top of each other in the previous version, 02." src="https://freight.cargo.site/w/1000/i/a3d4298f076ea35fdb0562c9c92f3359018587e70ca2a322fe7bc1ebafede68e/DIS_bloopers05.PNG" /> Editing capabilities were added to the ׳Scanning׳ mode, to allow users more flexibility and functionality to adjust the report cards in the environment. <img width="750" height="1624" width_o="750" height_o="1624" data-src="https://freight.cargo.site/t/original/i/26ba75b40e3422de451b8f2e5bafbd2f6cc6a588d772c90805fb98bc8c54eccc/DIS_vNext_improved05.png" data-mid="117894578" border="0" alt="Editing actions in the &quot;Scanning&quot; mode." data-caption="Editing actions in the &quot;Scanning&quot; mode." src="https://freight.cargo.site/w/750/i/26ba75b40e3422de451b8f2e5bafbd2f6cc6a588d772c90805fb98bc8c54eccc/DIS_vNext_improved05.png" /> Pinning FlowThe ׳Pinning׳ flow includes a more prominent entry point to the ׳Data in Space׳ experience, the report card is more refined, and the user guidance was greatly enhanced with intro carousel and richer banners. <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/a4d3c14158c8f68eb69652a9d14ffc89ba170b128284fc71dc9de17dd04cee79/DIS_InnerPinningvNext01.png" data-mid="117545912" border="0" alt="Entering the &quot;Pinning&quot; experience through a floating action button in the report." data-caption="Entering the &quot;Pinning&quot; experience through a floating action button in the report." src="https://freight.cargo.site/w/1000/i/a4d3c14158c8f68eb69652a9d14ffc89ba170b128284fc71dc9de17dd04cee79/DIS_InnerPinningvNext01.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/119b087f170b0a793e33d0e5d53276ecc30293ec71077a003bf63f4b77afbcec/DIS_InnerPinningvNext02.png" data-mid="117545913" border="0" alt="Refined report card look with report page name and filters rich infication." data-caption="Refined report card look with report page name and filters rich infication." src="https://freight.cargo.site/w/1000/i/119b087f170b0a793e33d0e5d53276ecc30293ec71077a003bf63f4b77afbcec/DIS_InnerPinningvNext02.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/7e8ed3d5e2e1c980915079d3ff111d74626c623cb262c5f80e832f43ee44fb70/DIS_InnerPinningvNext03.png" data-mid="117545914" border="0" alt="Intro carousel helping the user to learn about the interactions with the report card, 01." data-caption="Intro carousel helping the user to learn about the interactions with the report card, 01." src="https://freight.cargo.site/w/1000/i/7e8ed3d5e2e1c980915079d3ff111d74626c623cb262c5f80e832f43ee44fb70/DIS_InnerPinningvNext03.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/9ba33ce7a77fbd7a97495e44a66d77ed83522332a0ae1059b0aadefd7a5a5162/DIS_InnerPinningvNext04.png" data-mid="117545915" border="0" alt="Intro carousel helping the user to learn about the interactions with the report card, 02." data-caption="Intro carousel helping the user to learn about the interactions with the report card, 02." src="https://freight.cargo.site/w/1000/i/9ba33ce7a77fbd7a97495e44a66d77ed83522332a0ae1059b0aadefd7a5a5162/DIS_InnerPinningvNext04.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/fd269258828765b624699dac16c426dd6324c37ecb74de11389025e393f378f0/DIS_InnerPinningvNext05.png" data-mid="117545917" border="0" alt="Intro carousel helping the user to learn about the interactions with the report card, 03." data-caption="Intro carousel helping the user to learn about the interactions with the report card, 03." src="https://freight.cargo.site/w/1000/i/fd269258828765b624699dac16c426dd6324c37ecb74de11389025e393f378f0/DIS_InnerPinningvNext05.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/e87f0771411b64e4a804eed40d8d6f6c1747a8ac8548393d1c54895d3aeef3ba/DIS_InnerPinningvNext06.png" data-mid="117545918" border="0" alt="Improved help banners with richer text and icons." data-caption="Improved help banners with richer text and icons." src="https://freight.cargo.site/w/1000/i/e87f0771411b64e4a804eed40d8d6f6c1747a8ac8548393d1c54895d3aeef3ba/DIS_InnerPinningvNext06.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/9c5ce0bd30e3e2d27b7151e736b551cdc9d1e40f469b5979e15d2b9aba114aad/DIS_InnerPinningvNext07.png" data-mid="117545919" border="0" alt="&quot;Ghost&quot; card appearance when the surfaces are sufficiently mapped." data-caption="&quot;Ghost&quot; card appearance when the surfaces are sufficiently mapped." src="https://freight.cargo.site/w/1000/i/9c5ce0bd30e3e2d27b7151e736b551cdc9d1e40f469b5979e15d2b9aba114aad/DIS_InnerPinningvNext07.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/1e72de64afcdded8c42074acf0314970f97555941d7f8c52d578d80a6e40c83c/DIS_InnerPinningvNext08.png" data-mid="117545920" border="0" alt="Report cards that are pinned in the space are visible while &quot;pinning&quot; to allow more accurate position in the space." data-caption="Report cards that are pinned in the space are visible while &quot;pinning&quot; to allow more accurate position in the space." src="https://freight.cargo.site/w/1000/i/1e72de64afcdded8c42074acf0314970f97555941d7f8c52d578d80a6e40c83c/DIS_InnerPinningvNext08.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/32cd15c5552b10c7e68e8fec6358337c0ea7e57316193658782bd08d6cf06498/DIS_InnerPinningvNext09.png" data-mid="117545921" border="0" alt="Tapping &quot;Pin in Space&quot; saves the location of the report card." data-caption="Tapping &quot;Pin in Space&quot; saves the location of the report card." src="https://freight.cargo.site/w/1000/i/32cd15c5552b10c7e68e8fec6358337c0ea7e57316193658782bd08d6cf06498/DIS_InnerPinningvNext09.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/0a36da32a3f959f63412174cf412c1878b7b6e361fb4c436b95078bcb9c73a57/DIS_InnerPinningvNext10.png" data-mid="117545922" border="0" alt="After successful card saving, user can return to the report by tapping the back button." data-caption="After successful card saving, user can return to the report by tapping the back button." src="https://freight.cargo.site/w/1000/i/0a36da32a3f959f63412174cf412c1878b7b6e361fb4c436b95078bcb9c73a57/DIS_InnerPinningvNext10.png" /> <img width="508" height="1100" width_o="508" height_o="1100" data-src="https://freight.cargo.site/t/original/i/f4b62edcaea42cc8c59d1ef9e76254b114d7d922c252c952e0cf665257d74f6f/DIS_vNext_pinning_GIF.gif" data-mid="117593630" border="0" alt="Next version of the &quot;Pinning&quot; flow." data-caption="Next version of the &quot;Pinning&quot; flow." src="https://freight.cargo.site/w/508/i/f4b62edcaea42cc8c59d1ef9e76254b114d7d922c252c952e0cf665257d74f6f/DIS_vNext_pinning_GIF.gif" /> Scanning FlowThe ׳Scanning׳ flow provides editing functionality of repositioning and deleting the report cards in the space, for richer user experience and more accurate position in the physical space. <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/71076a7235ca6e48f6c202a633a728fe15d14e85629eebd6629ff3a05d6a2821/DIS_InnerScanningvNext01.png" data-mid="117893834" border="0" alt="Entering the &quot;Scanning&quot; mode by tapping the camera button in the app header." data-caption="Entering the &quot;Scanning&quot; mode by tapping the camera button in the app header." src="https://freight.cargo.site/w/1000/i/71076a7235ca6e48f6c202a633a728fe15d14e85629eebd6629ff3a05d6a2821/DIS_InnerScanningvNext01.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/de5953e05f981062c2c43b6ffd20699a29d63101827f5a33fcd885f3bee90512/DIS_InnerScanningvNext02.png" data-mid="117893835" border="0" alt="Mapping the surfaces in the physical area." data-caption="Mapping the surfaces in the physical area." src="https://freight.cargo.site/w/1000/i/de5953e05f981062c2c43b6ffd20699a29d63101827f5a33fcd885f3bee90512/DIS_InnerScanningvNext02.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/6acc7fa48b9160c0251f04aa0b5f0d6d03bd2ae0d77d7b2893ef2ea2481d744f/DIS_InnerScanningvNext03.png" data-mid="117893836" border="0" alt="Entering the &quot;Edit&quot; capabilities through the edit button after the report cards are found in the space." data-caption="Entering the &quot;Edit&quot; capabilities through the edit button after the report cards are found in the space." src="https://freight.cargo.site/w/1000/i/6acc7fa48b9160c0251f04aa0b5f0d6d03bd2ae0d77d7b2893ef2ea2481d744f/DIS_InnerScanningvNext03.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/b6ea567d401107c25ff9d05aabb75f298d11bc39685111bdc572f996721796d5/DIS_InnerScanningvNext04.png" data-mid="117893837" border="0" alt="The edit menu provides the user with &quot;Reposition&quot; or &quot;Delete&quot; the report cards in the space." data-caption="The edit menu provides the user with &quot;Reposition&quot; or &quot;Delete&quot; the report cards in the space." src="https://freight.cargo.site/w/1000/i/b6ea567d401107c25ff9d05aabb75f298d11bc39685111bdc572f996721796d5/DIS_InnerScanningvNext04.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/4c12bf88c27904e5f7e2521dcefe164592d192b8c696de24d07a049ca31ad060/DIS_InnerScanningvNext05.png" data-mid="117893838" border="0" alt="User selects the card he/she wants to adjust and position in a different location." data-caption="User selects the card he/she wants to adjust and position in a different location." src="https://freight.cargo.site/w/1000/i/4c12bf88c27904e5f7e2521dcefe164592d192b8c696de24d07a049ca31ad060/DIS_InnerScanningvNext05.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/afa961bfcfb3293cec55cb83a09e61da5e5495d59a15af2002da61b7fd38ebd8/DIS_InnerScanningvNext06.png" data-mid="117893839" border="0" alt="Tapping &quot;Pin in Space&quot; saves the new location of the report card in space." data-caption="Tapping &quot;Pin in Space&quot; saves the new location of the report card in space." src="https://freight.cargo.site/w/1000/i/afa961bfcfb3293cec55cb83a09e61da5e5495d59a15af2002da61b7fd38ebd8/DIS_InnerScanningvNext06.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/e598c97354e3459050df88e4a7faf2ebebc31c061799a444106154ae57c1fed5/DIS_InnerScanningvNext07.png" data-mid="117893840" border="0" alt="User returns to the &quot;Scanning&quot; mode by exiting the edit mode." data-caption="User returns to the &quot;Scanning&quot; mode by exiting the edit mode." src="https://freight.cargo.site/w/1000/i/e598c97354e3459050df88e4a7faf2ebebc31c061799a444106154ae57c1fed5/DIS_InnerScanningvNext07.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/84e20fbb4ac0d0f8a73cd870e314ea8f6fbad6148a8bc28e5865ea955ef23b25/DIS_InnerScanningvNext08.png" data-mid="117893841" border="0" alt="Entering the &quot;Edit&quot; capabilities through the edit button after the report cards are found in the space." data-caption="Entering the &quot;Edit&quot; capabilities through the edit button after the report cards are found in the space." src="https://freight.cargo.site/w/1000/i/84e20fbb4ac0d0f8a73cd870e314ea8f6fbad6148a8bc28e5865ea955ef23b25/DIS_InnerScanningvNext08.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/6e4bd4cb41d35f33f7ddc73fc1be6bd4336f561c7a6a3c9e8c317e1aafa63ad6/DIS_InnerScanningvNext09.png" data-mid="117893842" border="0" alt="The edit menu provides the user with &quot;Reposition&quot; or &quot;Delete&quot; the report cards in the space." data-caption="The edit menu provides the user with &quot;Reposition&quot; or &quot;Delete&quot; the report cards in the space." src="https://freight.cargo.site/w/1000/i/6e4bd4cb41d35f33f7ddc73fc1be6bd4336f561c7a6a3c9e8c317e1aafa63ad6/DIS_InnerScanningvNext09.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/2208a0e072d06917696fbbb93201598838ab55b626c0c3a6a417f2d18bd23934/DIS_InnerScanningvNext10.png" data-mid="117893843" border="0" alt="Tapping the &quot;X&quot; button next to each card, deletes a specific report card." data-caption="Tapping the &quot;X&quot; button next to each card, deletes a specific report card." src="https://freight.cargo.site/w/1000/i/2208a0e072d06917696fbbb93201598838ab55b626c0c3a6a417f2d18bd23934/DIS_InnerScanningvNext10.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/c094319a4b6397c4ece606f617d9f13ba1d90175d3b8fde2139f72c8501d386d/DIS_InnerScanningvNext11.png" data-mid="117893844" border="0" alt="User returns to the &quot;Scanning&quot; mode by exiting the edit mode." data-caption="User returns to the &quot;Scanning&quot; mode by exiting the edit mode." src="https://freight.cargo.site/w/1000/i/c094319a4b6397c4ece606f617d9f13ba1d90175d3b8fde2139f72c8501d386d/DIS_InnerScanningvNext11.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/86a9c827d933a2839a224796c7745911ed9543bda85335eb965a59c4b60f3b70/DIS_InnerScanningvNext12.png" data-mid="117893845" border="0" alt="Tapping the report card in the space, opens the report it represents." data-caption="Tapping the report card in the space, opens the report it represents." src="https://freight.cargo.site/w/1000/i/86a9c827d933a2839a224796c7745911ed9543bda85335eb965a59c4b60f3b70/DIS_InnerScanningvNext12.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/7b116e9741ab6ad0b0e982891d5855163a441111fcda92a7c6dc532df2e54886/DIS_InnerScanningvNext13.png" data-mid="117893846" border="0" alt="Opening the report, the user can now interact with the data." data-caption="Opening the report, the user can now interact with the data." src="https://freight.cargo.site/w/1000/i/7b116e9741ab6ad0b0e982891d5855163a441111fcda92a7c6dc532df2e54886/DIS_InnerScanningvNext13.png" /> <img width="369" height="799" width_o="369" height_o="799" data-src="https://freight.cargo.site/t/original/i/073f4d368877b70c96f8907e205836be720cc33f2d2475e2a444badf02931083/DIS_vNext_scaning2_GIF.gif" data-mid="117894910" border="0" alt="Next version of the &quot;Scanning&quot; flow." data-caption="Next version of the &quot;Scanning&quot; flow." src="https://freight.cargo.site/w/369/i/073f4d368877b70c96f8907e205836be720cc33f2d2475e2a444badf02931083/DIS_vNext_scaning2_GIF.gif" /> Stay tuned for more updates about the next experience of ׳Data in Space׳ ;) <img width="924" height="2000" width_o="924" height_o="2000" data-src="https://freight.cargo.site/t/original/i/294ad25172e2aa25a33ebf47a0f79baad5c0e233360627d74e8c6fd0419e33e8/DIS_ScanningPic01.png" data-mid="117572317" border="0" alt="Testing &quot;Data in Space&quot; in the first version, with the help of my cat." data-caption="Testing &quot;Data in Space&quot; in the first version, with the help of my cat." src="https://freight.cargo.site/w/924/i/294ad25172e2aa25a33ebf47a0f79baad5c0e233360627d74e8c6fd0419e33e8/DIS_ScanningPic01.png" /> <img width="2000" height="924" width_o="2000" height_o="924" data-src="https://freight.cargo.site/t/original/i/309afd9be594f8786e691f16f0e099857d20fa213a79ce6a6b5ced40a1b991e9/DIS_ScanningPic03.png" data-mid="117572319" border="0" alt="Testing &quot;Data in Space&quot; in one of the early versions, with the help of my cat." data-caption="Testing &quot;Data in Space&quot; in one of the early versions, with the help of my cat." src="https://freight.cargo.site/w/1000/i/309afd9be594f8786e691f16f0e099857d20fa213a79ce6a6b5ced40a1b991e9/DIS_ScanningPic03.png" /> https://ziganna.me/Profile-page Mon, 12 Jul 2021 21:22:24 +0000 Ziganna https://ziganna.me/Profile-page Profile Page M365 Security and Compliance Center profile page [Role] Lead product designer, Experience definition Microsoft Defender for Identity, App design, 2016-2018 <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/8f153f016d2962f43e70704094b07545938224b7b707d6a92be6f1675e5d6ed3/ProfilePage_inner01-2.png" data-mid="114415887" border="0" alt="User profile page in the Microsoft 365 SCC (Security and Compliance Center) portal" data-caption="User profile page in the Microsoft 365 SCC (Security and Compliance Center) portal" src="https://freight.cargo.site/w/1000/i/8f153f016d2962f43e70704094b07545938224b7b707d6a92be6f1675e5d6ed3/ProfilePage_inner01-2.png" /> The profile page was a two year project that started as a feature in the On-premise security product I was a part of (pahse 1), expanded to include more data sources from other security products (phase 2), and eventually landed in the greater Microsoft 365 SCC portal (phase 3). The profile page in the Security portal is the vocal point for all information on the specific entity (user, machine, etc.). All security investigations start and end in the profile page, due to the value it provides the security analysts while investigating a potential threat.&nbsp; SuccessesCore experiences that were developed for the profile page: User flow in the page, layout and the ID component were applied in the wider Microsoft security products and platforms, and were successfuly scaled and withheld various content and information architectures versions. <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/8efb661d002eddae9d7dca11a2fc54881ee314ee8770e9bcd88ea1c5d4547954/ProfilePage_phaseone_inner01.png" data-mid="114556689" border="0" alt="Advanced Threat Analytics Profile page, pahse 1" data-caption="Advanced Threat Analytics Profile page, pahse 1" src="https://freight.cargo.site/w/1000/i/8efb661d002eddae9d7dca11a2fc54881ee314ee8770e9bcd88ea1c5d4547954/ProfilePage_phaseone_inner01.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/39f6fe84d4a734060f72da9d6acd2a4e9e5070d45c3b4147a9d17a8c849ecfda/ProfilePage_inner03.png" data-mid="114416733" border="0" alt="Azure Advanced Threat Protection Profile page, pahse 2" data-caption="Azure Advanced Threat Protection Profile page, pahse 2" src="https://freight.cargo.site/w/1000/i/39f6fe84d4a734060f72da9d6acd2a4e9e5070d45c3b4147a9d17a8c849ecfda/ProfilePage_inner03.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/8f153f016d2962f43e70704094b07545938224b7b707d6a92be6f1675e5d6ed3/ProfilePage_inner01-2.png" data-mid="114415887" border="0" alt="M365 SCC portal Profile page, pahse 3" data-caption="M365 SCC portal Profile page, pahse 3" src="https://freight.cargo.site/w/1000/i/8f153f016d2962f43e70704094b07545938224b7b707d6a92be6f1675e5d6ed3/ProfilePage_inner01-2.png" /> LayoutThe structure of the page can sustain different data models and investigation flows. The page information architecture withstands multiple information hierarchies, by anchoring the ID component as the constent data pillar and allowing free hierarchical play in the tab area. <img width="2000" height="979" width_o="2000" height_o="979" data-src="https://freight.cargo.site/t/original/i/50a0c8877cf0ab0cb527efbcce59b684a59bebf8862e8929e7b2e454aff54ccb/ProfilePage_GIF01.gif" data-mid="114403251" border="0" alt="Data Models - The layout can withold various grids for different data model structures in the tab area." data-caption="Data Models - The layout can withold various grids for different data model structures in the tab area." src="https://freight.cargo.site/w/1000/i/50a0c8877cf0ab0cb527efbcce59b684a59bebf8862e8929e7b2e454aff54ccb/ProfilePage_GIF01.gif" /> <img width="2000" height="979" width_o="2000" height_o="979" data-src="https://freight.cargo.site/t/original/i/169f6dbf93740d9886774824dc1a23d1d00a97631a279981bc5735814d6dbe90/ProfilePage_GIF02.gif" data-mid="114403252" border="0" alt="Information Architecture - Withstand multiple information hierarchies in the tab area." data-caption="Information Architecture - Withstand multiple information hierarchies in the tab area." src="https://freight.cargo.site/w/1000/i/169f6dbf93740d9886774824dc1a23d1d00a97631a279981bc5735814d6dbe90/ProfilePage_GIF02.gif" /> Flow The page is a platform of diverse navigation flows: The fixed ID component allows cross reference to different tabbed content when investigating. The tabbed content allows multiple contexts in the same investigation flow. And the side panel provides additional on-demand data from various points in the page, while keeping the user within the context of the entire page. <img width="2000" height="979" width_o="2000" height_o="979" data-src="https://freight.cargo.site/t/original/i/6c6b6dca48821033786ddb7fd2f4c538f3b79252cd6cf3ab3c7e313c37b214bb/ProfilePage_GIF03.gif" data-mid="114420291" border="0" alt="Diverse navigation flows due to thought through components and layout" data-caption="Diverse navigation flows due to thought through components and layout" src="https://freight.cargo.site/w/1000/i/6c6b6dca48821033786ddb7fd2f4c538f3b79252cd6cf3ab3c7e313c37b214bb/ProfilePage_GIF03.gif" /> ID Component The ID component has three functions: Integrated -&nbsp;basic information anchor component in the profile page. Standalone -&nbsp;a separate standalone hover menu across all pages, that serves as a contextual investigation facilitator.Content Platform - sustains various contents and information architectures according to different needs and flows. ID information hierarchy - Accommodates both level 1 and 2 in collapsable structure. ID information layout - Accommodates different grids. <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/8a03f01c5de7968b4ca6687c15fbbe5e71a68359eb1fdee7b476a1f5cbb01b6f/Artboard-Copy-22.png" data-mid="114437360" border="0" alt="Left: Integrated ID component in the profile as part of the layout,right: Standalone ID component as a hover tooltip on the user name." data-caption="Left: Integrated ID component in the profile as part of the layout,&lt;br&gt;right: Standalone ID component as a hover tooltip on the user name." src="https://freight.cargo.site/w/1000/i/8a03f01c5de7968b4ca6687c15fbbe5e71a68359eb1fdee7b476a1f5cbb01b6f/Artboard-Copy-22.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/e8a06448a57b39f42945b34874863b90f9d4ac515f7562fa6fcc3b9e8ab18b9d/Artboard-Copy-13.png" data-mid="114437359" border="0" src="https://freight.cargo.site/w/1000/i/e8a06448a57b39f42945b34874863b90f9d4ac515f7562fa6fcc3b9e8ab18b9d/Artboard-Copy-13.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/c456d7a51b39685bbedb2a4458687df0b57e75c4999304175dad0b85437814cf/Artboard-Copy-23.png" data-mid="114437362" border="0" alt="ID component as a standalone hover tooltip across other areas in the product. Left to right: Hover, long hover and manual expansion states." data-caption="ID component as a standalone hover tooltip across other areas in the product. Left to right: Hover, long hover and manual expansion states." src="https://freight.cargo.site/w/1000/i/c456d7a51b39685bbedb2a4458687df0b57e75c4999304175dad0b85437814cf/Artboard-Copy-23.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/088a4b36836e1d9b70f03f8d3971e5d06775d9f8f9c7afc5bf6af7c455ca48b3/Artboard-Copy-24.png" data-mid="114437363" border="0" alt="ID component as an integrated part of the profile page. Left to right: Collapse, default and expanded(The height grows to accommodate content without scroll bars) states." data-caption="ID component as an integrated part of the profile page. Left to right: Collapse, default and expanded&lt;br&gt;(The height grows to accommodate content without scroll bars) states." src="https://freight.cargo.site/w/1000/i/088a4b36836e1d9b70f03f8d3971e5d06775d9f8f9c7afc5bf6af7c455ca48b3/Artboard-Copy-24.png" /> ︎&nbsp; Phase OneProfile page redesignAdvanced Threat Analytics profile page App design, 2016 <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/8efb661d002eddae9d7dca11a2fc54881ee314ee8770e9bcd88ea1c5d4547954/ProfilePage_phaseone_inner01.png" data-mid="114556689" border="0" alt="Advanced Threat Analytics (ATA) profile page after redesign, Activities tab (1)." data-caption="Advanced Threat Analytics (ATA) profile page after redesign, Activities tab (1)." src="https://freight.cargo.site/w/1000/i/8efb661d002eddae9d7dca11a2fc54881ee314ee8770e9bcd88ea1c5d4547954/ProfilePage_phaseone_inner01.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/cb5802eb28912c636c68ecc01580723096f6394e62d33f9ac2d3e1253692cbc0/ProfilePage_phaseone_inner02.png" data-mid="114555295" border="0" alt="Advanced Threat Analytics (ATA) profile page after redesign, Activities tab (2)." data-caption="Advanced Threat Analytics (ATA) profile page after redesign, Activities tab (2)." src="https://freight.cargo.site/w/1000/i/cb5802eb28912c636c68ecc01580723096f6394e62d33f9ac2d3e1253692cbc0/ProfilePage_phaseone_inner02.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/d5ac6aabccdd1b69809497ea9b5941c911cf90150544862351bf6e2826e4e8cc/ProfilePage_phaseone_inner03.png" data-mid="114555296" border="0" alt="Advanced Threat Analytics (ATA) profile page after redesign, Activities tab (3)." data-caption="Advanced Threat Analytics (ATA) profile page after redesign, Activities tab (3)." src="https://freight.cargo.site/w/1000/i/d5ac6aabccdd1b69809497ea9b5941c911cf90150544862351bf6e2826e4e8cc/ProfilePage_phaseone_inner03.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/cbc33cc2d0583c6c73ca4acd5fa2c6c84097084e95eb9c5226ca4151b89b7d60/ProfilePage_phaseone_inner04.png" data-mid="114555297" border="0" alt="Advanced Threat Analytics (ATA) profile page after redesign, Summary tab (1)." data-caption="Advanced Threat Analytics (ATA) profile page after redesign, Summary tab (1)." src="https://freight.cargo.site/w/1000/i/cbc33cc2d0583c6c73ca4acd5fa2c6c84097084e95eb9c5226ca4151b89b7d60/ProfilePage_phaseone_inner04.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/d7222cc082b15ceb3ca522202d11cc1a9a5d47efa6db5012972b325bc92436a7/ProfilePage_phaseone_inner05.png" data-mid="114555298" border="0" alt="Advanced Threat Analytics (ATA) profile page after redesign, Summary tab (2)." data-caption="Advanced Threat Analytics (ATA) profile page after redesign, Summary tab (2)." src="https://freight.cargo.site/w/1000/i/d7222cc082b15ceb3ca522202d11cc1a9a5d47efa6db5012972b325bc92436a7/ProfilePage_phaseone_inner05.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/f19abd7f82ead7be66f66282d7c840a61b5f32d815d536322089dea75d363ee2/ProfilePage_phaseone_inner06.png" data-mid="114555299" border="0" alt="Advanced Threat Analytics (ATA) profile page after redesign, Summary tab (3)." data-caption="Advanced Threat Analytics (ATA) profile page after redesign, Summary tab (3)." src="https://freight.cargo.site/w/1000/i/f19abd7f82ead7be66f66282d7c840a61b5f32d815d536322089dea75d363ee2/ProfilePage_phaseone_inner06.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/ef1876bce93eb351ad065c806667ad114386243c232c2663c80805ebad465496/ProfilePage_phaseone_inner07.png" data-mid="114555300" border="0" alt="Advanced Threat Analytics (ATA) profile page after redesign, Directory Data tab." data-caption="Advanced Threat Analytics (ATA) profile page after redesign, Directory Data tab." src="https://freight.cargo.site/w/1000/i/ef1876bce93eb351ad065c806667ad114386243c232c2663c80805ebad465496/ProfilePage_phaseone_inner07.png" /> Why redesign?The profile page already existed in the Advanced Threat Analytics (ATA) product and was commonly used. However, telemetry indicated there was room for growth. <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/6e4c06542cb35cd577c2b883e98a509e1dd28801358c80aef138a81ae534c834/ProfilePage_inner08.png" data-mid="114551844" border="0" alt="Desicion flow based on product telemetry and team knowledge and understanding, of the issues that should be addressed in the profile page." data-caption="Desicion flow based on product telemetry and team knowledge and understanding, of the issues that should be addressed in the profile page." src="https://freight.cargo.site/w/1000/i/6e4c06542cb35cd577c2b883e98a509e1dd28801358c80aef138a81ae534c834/ProfilePage_inner08.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/40dba5a3d485974466b2327726240854cc5235b0ab1fe246f988225a4307827d/ProfilePage_inner09.png" data-mid="114551845" border="0" data-scale="89" alt="Telemetry and insights after the redesign of the profile page." data-caption="Telemetry and insights after the redesign of the profile page." src="https://freight.cargo.site/w/1000/i/40dba5a3d485974466b2327726240854cc5235b0ab1fe246f988225a4307827d/ProfilePage_inner09.png" /> Defining Problems The telemtry lead us to understand that the profile page: Lacked relevant data - the existing data was insufficient during an investigation. Users needed more guidance in the flow once landed in the page and had partial understanding of the provided due to its approachability (content design). ︎ Setting GoalsSurface additional releveant data in the profile page, which will help the users and position the product as an identity investigation market leader platform. Guide the users in the investigation flow through improved experience and provide value by helping to understand the security world. Redesign ProcessThe redesign started with understanding the type of data the product can surface, its relevance and hierarchy. This lead to layout and flow experimentations. <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/a251c37fb862ffd5520e50eeffe6f926219fa01e0cfb473800e70d16852831e3/ProfilePage_inner10.png" data-mid="114552085" border="0" alt="The investigation flow guided the data categorization and prioritization." data-caption="The investigation flow guided the data categorization and prioritization." src="https://freight.cargo.site/w/1000/i/a251c37fb862ffd5520e50eeffe6f926219fa01e0cfb473800e70d16852831e3/ProfilePage_inner10.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/7daf67561e0eae029af866f4fe31a6fa5e89a951f90eabd175fc0eb015ae1d63/ProfilePage_inner11.png" data-mid="114552086" border="0" alt="The data was structured into an information architecture that surved as a layout reference." data-caption="The data was structured into an information architecture that surved as a layout reference." src="https://freight.cargo.site/w/1000/i/7daf67561e0eae029af866f4fe31a6fa5e89a951f90eabd175fc0eb015ae1d63/ProfilePage_inner11.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/48ee8f58f277aaace61710ead974be0a3edd6a0fb70a50c23d7cd327a1584124/ProfilePage_inner12.png" data-mid="114552087" border="0" alt="The relevance of the data in the investigation flow guided the user journey and data layering throughout the profile page and entire product." data-caption="The relevance of the data in the investigation flow guided the user journey and data layering throughout the profile page and entire product." src="https://freight.cargo.site/w/1000/i/48ee8f58f277aaace61710ead974be0a3edd6a0fb70a50c23d7cd327a1584124/ProfilePage_inner12.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/a1e800b9afdac7e5e499da172b3738f6b382ee523e27b30d55949774e03ca131/ProfilePage_inner13.png" data-mid="114552088" border="0" alt="The design process started with layouting the prioritized data in the suitable hierarchies (layout 1)." data-caption="The design process started with layouting the prioritized data in the suitable hierarchies (layout 1)." src="https://freight.cargo.site/w/1000/i/a1e800b9afdac7e5e499da172b3738f6b382ee523e27b30d55949774e03ca131/ProfilePage_inner13.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/26906d390b807f982adbde7976cfe79b7441cc084fddcf3ef822e09d46548832/ProfilePage_inner14.png" data-mid="114552089" border="0" alt="The design process started with layouting the prioritized data in the suitable hierarchies (layout 2)." data-caption="The design process started with layouting the prioritized data in the suitable hierarchies (layout 2)." src="https://freight.cargo.site/w/1000/i/26906d390b807f982adbde7976cfe79b7441cc084fddcf3ef822e09d46548832/ProfilePage_inner14.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/92de169e6fc1dcc6aa930eba1dfe842782559298bcd08cef20d2230a0e2a5287/ProfilePage_inner15.png" data-mid="114552090" border="0" alt="The design process started with layouting the prioritized data in the suitable hierarchies (layout 3)." data-caption="The design process started with layouting the prioritized data in the suitable hierarchies (layout 3)." src="https://freight.cargo.site/w/1000/i/92de169e6fc1dcc6aa930eba1dfe842782559298bcd08cef20d2230a0e2a5287/ProfilePage_inner15.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/050d27e797ba284a127b5c34812271b5d4ee7fdd419a7ab6b62e10614a4e572f/ProfilePage_inner16.png" data-mid="114552091" border="0" alt="The design process started with layouting the prioritized data in the suitable hierarchies (layout 4)." data-caption="The design process started with layouting the prioritized data in the suitable hierarchies (layout 4)." src="https://freight.cargo.site/w/1000/i/050d27e797ba284a127b5c34812271b5d4ee7fdd419a7ab6b62e10614a4e572f/ProfilePage_inner16.png" /> User ResearchThroughout every step of the way the data and flow directions were validated and examined with our users.&nbsp;The feedback allowed focus and guided us to better desicion making.&nbsp; Click here to take a look at the user research results and insights in depth. <img width="2870" height="1574" width_o="2870" height_o="1574" data-src="https://freight.cargo.site/t/original/i/c4574923f86e84f15e908fa3bf0941edba3396c6ceb74545bc15c1244c6523f3/ProfilePage_survey01.png" data-mid="114552189" border="0" alt="Steps for investigating an alert, CAB results analysis, Q2." data-caption="Steps for investigating an alert, CAB results analysis, Q2." src="https://freight.cargo.site/w/1000/i/c4574923f86e84f15e908fa3bf0941edba3396c6ceb74545bc15c1244c6523f3/ProfilePage_survey01.png" /> <img width="2870" height="1574" width_o="2870" height_o="1574" data-src="https://freight.cargo.site/t/original/i/33ca6504f4b8787e87d373cbffb34b94527b7bfc228d0951db1a8640ed788991/ProfilePage_survey02.png" data-mid="114552190" border="0" alt="Important info for user investigation, CAB results analysis, Q3." data-caption="Important info for user investigation, CAB results analysis, Q3." src="https://freight.cargo.site/w/1000/i/33ca6504f4b8787e87d373cbffb34b94527b7bfc228d0951db1a8640ed788991/ProfilePage_survey02.png" /> <img width="2870" height="1574" width_o="2870" height_o="1574" data-src="https://freight.cargo.site/t/original/i/212a667431bbf763800d858094f5eb9a18f49e23c3a1a087239eca40115918d5/ProfilePage_survey03.png" data-mid="114552191" border="0" alt="Useful informationin an incident investigation, CAB results analysis, Q9." data-caption="Useful informationin an incident investigation, CAB results analysis, Q9." src="https://freight.cargo.site/w/1000/i/212a667431bbf763800d858094f5eb9a18f49e23c3a1a087239eca40115918d5/ProfilePage_survey03.png" /> Redesign OutputsThe chosen layout presented the desired data prioritization,and could sustain a flow which supported the investigation user flow. <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/98cc36c42ad44d88203d17030a5012de812f478a15bd52f600b8e9e9051a30bf/ProfilePage_inner17.png" data-mid="114554213" border="0" alt="The chosen layout for the new profile page." data-caption="The chosen layout for the new profile page." src="https://freight.cargo.site/w/1000/i/98cc36c42ad44d88203d17030a5012de812f478a15bd52f600b8e9e9051a30bf/ProfilePage_inner17.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/cc3a88bbc23f80b53a05e86ddfba6d3f39f6020a9a84c3b4bfb99401e8b8b1b3/ProfilePage_inner18.png" data-mid="114554397" border="0" alt="The Activities tab in the new profile page." data-caption="The Activities tab in the new profile page." src="https://freight.cargo.site/w/1000/i/cc3a88bbc23f80b53a05e86ddfba6d3f39f6020a9a84c3b4bfb99401e8b8b1b3/ProfilePage_inner18.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/5a701170bdd764c1a11895521511cdace4eeb44228320547b7d04cbb740b362d/ProfilePage_inner19.png" data-mid="114554398" border="0" alt="The Directory Data tab in the new profile page." data-caption="The Directory Data tab in the new profile page." src="https://freight.cargo.site/w/1000/i/5a701170bdd764c1a11895521511cdace4eeb44228320547b7d04cbb740b362d/ProfilePage_inner19.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/622c1237a797290ff85845673bccebc4dd8ec4294796e29b6e7dfc17f9645578/ProfilePage_inner20.png" data-mid="114554399" border="0" alt="The Summary tab in the new profile page." data-caption="The Summary tab in the new profile page." src="https://freight.cargo.site/w/1000/i/622c1237a797290ff85845673bccebc4dd8ec4294796e29b6e7dfc17f9645578/ProfilePage_inner20.png" /> I utilized the redesign to tell a story not only on the micro level in the profile page, but also in the entire product, and understand how principles that were implemented in the page could become valuable to the users all across.Consequently, components like the mini-ID were born, the content was revised from a humanized POV, and critical indicators were added to all appearances of entities in the product. <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/0375f5f6d60a63badca7e0064295f4d224f65c80573c7a69e017dfa9c352f702/ProfilePage_inner21.png" data-mid="114554400" border="0" alt="Mini ID component, a standalone component across the product that was born as a result of the redesign process." data-caption="Mini ID component, a standalone component across the product that was born as a result of the redesign process." src="https://freight.cargo.site/w/1000/i/0375f5f6d60a63badca7e0064295f4d224f65c80573c7a69e017dfa9c352f702/ProfilePage_inner21.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/02c6dedcbaf597efc8e4ff48b7dc076c7253fee00cefe7a16d6c9093bd4417c6/ProfilePage_inner22.png" data-mid="114554401" border="0" alt="Indicators of alerts and characteristics were added across the product." data-caption="Indicators of alerts and characteristics were added across the product." src="https://freight.cargo.site/w/1000/i/02c6dedcbaf597efc8e4ff48b7dc076c7253fee00cefe7a16d6c9093bd4417c6/ProfilePage_inner22.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/2bd6fa41d5c33d5eed05d3aad261a745b1bc0f7c2bea13f8a8acf1603df17ca3/ProfilePage_inner23.png" data-mid="114554402" border="0" alt="Mapping of the different types of the indicators that were added across the product and the profile page." data-caption="Mapping of the different types of the indicators that were added across the product and the profile page." src="https://freight.cargo.site/w/1000/i/2bd6fa41d5c33d5eed05d3aad261a745b1bc0f7c2bea13f8a8acf1603df17ca3/ProfilePage_inner23.png" /> Redesign OutcomesThe sucess of the redesign positioned the product as a security leader in the identity pillar - the surfaced data was a key investigation point in identity protection. The new page provided an easy flow and hierarchies for the user to maneuver through the data and decide upon next steps in the investigation. Moreover, it helped the users to better understand the security world - the&nbsp;layout, data and holistic approach made the entire experience approachable and the users could now ask the right questions. ︎ Phase TwoProfile page redesignAdvanced Threat Protection profile page App design, 2017 <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/5aebc629dcde086ef3c9768af1bc99f726271c5b193ebd3e968a74fef093e68f/ProfilePage_phasetwo_inner01.png" data-mid="114555315" border="0" alt="Advanced Threat Protection (ATP) profile page, Activities tab (1)." data-caption="Advanced Threat Protection (ATP) profile page, Activities tab (1)." src="https://freight.cargo.site/w/1000/i/5aebc629dcde086ef3c9768af1bc99f726271c5b193ebd3e968a74fef093e68f/ProfilePage_phasetwo_inner01.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/c9892530b1cab69905c80ef13cafaf668a82d9631735a27d7ea7d23d0ee440fb/ProfilePage_phasetwo_inner02.png" data-mid="114555319" border="0" alt="Advanced Threat Protection (ATP) profile page, Activities tab (2)." data-caption="Advanced Threat Protection (ATP) profile page, Activities tab (2)." src="https://freight.cargo.site/w/1000/i/c9892530b1cab69905c80ef13cafaf668a82d9631735a27d7ea7d23d0ee440fb/ProfilePage_phasetwo_inner02.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/77d408540107e115d2cbc087884aaccd6a578ff0e1edaa39699df31ab9511fc5/ProfilePage_phasetwo_inner03.png" data-mid="114555321" border="0" alt="Advanced Threat Protection (ATP) profile page, Activities tab (3)." data-caption="Advanced Threat Protection (ATP) profile page, Activities tab (3)." src="https://freight.cargo.site/w/1000/i/77d408540107e115d2cbc087884aaccd6a578ff0e1edaa39699df31ab9511fc5/ProfilePage_phasetwo_inner03.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/62940a4fabcf9ddcad92950c9ca0b3581ab20766e0a90843bdef3c915dbea98a/ProfilePage_phasetwo_inner04.png" data-mid="114555322" border="0" alt="Advanced Threat Protection (ATP) profile page, Activities tab (4)." data-caption="Advanced Threat Protection (ATP) profile page, Activities tab (4)." src="https://freight.cargo.site/w/1000/i/62940a4fabcf9ddcad92950c9ca0b3581ab20766e0a90843bdef3c915dbea98a/ProfilePage_phasetwo_inner04.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/6bdf4be134566a2724e4079b771d1b135262322e49b9661587337bfd0d87d9ef/ProfilePage_phasetwo_inner05.png" data-mid="114555323" border="0" alt="Advanced Threat Protection (ATP) profile page, Threat Analysis tab (1)." data-caption="Advanced Threat Protection (ATP) profile page, Threat Analysis tab (1)." src="https://freight.cargo.site/w/1000/i/6bdf4be134566a2724e4079b771d1b135262322e49b9661587337bfd0d87d9ef/ProfilePage_phasetwo_inner05.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/a71ddbbfff900c5727357c217108dc3999ba36256cab77a8d19de4fe02efd726/ProfilePage_phasetwo_inner06.png" data-mid="114555324" border="0" alt="Advanced Threat Protection (ATP) profile page, Threat Analysis tab (2)." data-caption="Advanced Threat Protection (ATP) profile page, Threat Analysis tab (2)." src="https://freight.cargo.site/w/1000/i/a71ddbbfff900c5727357c217108dc3999ba36256cab77a8d19de4fe02efd726/ProfilePage_phasetwo_inner06.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/abb4d85294242351cc2816940052235a78febb88beb6b6c1d668a33c1989d1b1/ProfilePage_phasetwo_inner07.png" data-mid="114555325" border="0" alt="Advanced Threat Protection (ATP) profile page, Threat Analysis tab (3)." data-caption="Advanced Threat Protection (ATP) profile page, Threat Analysis tab (3)." src="https://freight.cargo.site/w/1000/i/abb4d85294242351cc2816940052235a78febb88beb6b6c1d668a33c1989d1b1/ProfilePage_phasetwo_inner07.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/2393811e025fb8a370894864dfc7b451b0effb8465638c5798a94f198ee680fb/ProfilePage_phasetwo_inner08.png" data-mid="114555326" border="0" alt="Advanced Threat Protection (ATP) profile page, Directory Data tab." data-caption="Advanced Threat Protection (ATP) profile page, Directory Data tab." src="https://freight.cargo.site/w/1000/i/2393811e025fb8a370894864dfc7b451b0effb8465638c5798a94f198ee680fb/ProfilePage_phasetwo_inner08.png" /> Why integrate with other products? Users wanted the identity investigation story to consist of data from all Microsoft security sources to provide them one-stop-shop of knoweldge and investigation. Integartions with other data sources were the next step of the page redesign, along with enhancing functionalities like filtering. Challenges Each product had a different visual representation of activities and alerts as separates and as a collective. Other products presented the data as a table view while ATA approached each data differently with huminization and storytelling in mind. <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/d84105218d002b14b4388e96a62ccb8eb5870f587156e2842568d14e7362b85d/ProfilePage_inner24.png" data-mid="114567250" border="0" alt="Advanced Threat Analytics activities (phase one). Combined view of an activity and an alert card (1)." data-caption="Advanced Threat Analytics activities (phase one). Combined view of an activity and an alert card (1)." src="https://freight.cargo.site/w/1000/i/d84105218d002b14b4388e96a62ccb8eb5870f587156e2842568d14e7362b85d/ProfilePage_inner24.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/26579b6810b5cccfe234d9166f9e9aa5270f35358fb2a4d8fad0ae46b87ca3de/ProfilePage_inner25.png" data-mid="114567251" border="0" alt="Advanced Threat Analytics activities (phase one). Combined view of an activity and an alert card (2)." data-caption="Advanced Threat Analytics activities (phase one). Combined view of an activity and an alert card (2)." src="https://freight.cargo.site/w/1000/i/26579b6810b5cccfe234d9166f9e9aa5270f35358fb2a4d8fad0ae46b87ca3de/ProfilePage_inner25.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/f5c3f3c5915e3fba6ae242b719b045bf0f1d4997476f8de9fbde8ac881561a64/ProfilePage_inner26.png" data-mid="114567252" border="0" alt="Advanced Threat Analytics activities (phase one). Combined view of an activity and an alert card (3)." data-caption="Advanced Threat Analytics activities (phase one). Combined view of an activity and an alert card (3)." src="https://freight.cargo.site/w/1000/i/f5c3f3c5915e3fba6ae242b719b045bf0f1d4997476f8de9fbde8ac881561a64/ProfilePage_inner26.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/551377ef19c92c6f5544e45eff5f23a4ea723860384af8976e29009b70d68cda/ProfilePage_inner27.png" data-mid="114567253" border="0" alt="Other security products activities as a table view." data-caption="Other security products activities as a table view." src="https://freight.cargo.site/w/1000/i/551377ef19c92c6f5544e45eff5f23a4ea723860384af8976e29009b70d68cda/ProfilePage_inner27.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/49ebfff7cb30f77791ed7b17acb8183d688677c1a58e3d9509b0d9d815934c2a/ProfilePage_inner28.png" data-mid="114567255" border="0" alt="Advanced Threat Protection profile page activities (phase two). Combination of activities from pahse one and the table view (1)." data-caption="Advanced Threat Protection profile page activities (phase two). Combination of activities from pahse one and the table view (1)." src="https://freight.cargo.site/w/1000/i/49ebfff7cb30f77791ed7b17acb8183d688677c1a58e3d9509b0d9d815934c2a/ProfilePage_inner28.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/90f3b2cc26aa7ae8f8d2f87552b1b643215dab16746f2ea61664fd41114295c7/ProfilePage_inner29.png" data-mid="114567257" border="0" alt="Advanced Threat Protection profile page activities (phase two). Combination of activities from pahse one and the table view (2)." data-caption="Advanced Threat Protection profile page activities (phase two). Combination of activities from pahse one and the table view (2)." src="https://freight.cargo.site/w/1000/i/90f3b2cc26aa7ae8f8d2f87552b1b643215dab16746f2ea61664fd41114295c7/ProfilePage_inner29.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/939db6ae8e644279d4d7cf57d96b6a4098ece7968d827b7c6093cadab723bfa1/ProfilePage_inner30.png" data-mid="114567258" border="0" alt="Advanced Threat Protection profile page activities (phase two). Combination of activities from pahse one and the table view (3)." data-caption="Advanced Threat Protection profile page activities (phase two). Combination of activities from pahse one and the table view (3)." src="https://freight.cargo.site/w/1000/i/939db6ae8e644279d4d7cf57d96b6a4098ece7968d827b7c6093cadab723bfa1/ProfilePage_inner30.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/017779d31087bf388f000de47f5a86f34e9d77ebafc2248eb4fd1ef0e7cc9e85/ProfilePage_inner31.png" data-mid="114567259" border="0" alt="Advanced Threat Protection profile page activities (phase two). Final result." data-caption="Advanced Threat Protection profile page activities (phase two). Final result." src="https://freight.cargo.site/w/1000/i/017779d31087bf388f000de47f5a86f34e9d77ebafc2248eb4fd1ef0e7cc9e85/ProfilePage_inner31.png" /> Design Results The integration of the products pushed the design alignment of the different activities representations into a hybrid table - timeline view. The tabs were layouted at the top of the content.&nbsp;The highlighted summary was visualized and focused to display the most important investigation triggers. The ID component was populated with L2 data.&nbsp; <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/45cc3403690dcf459c30d656733b0fa24f9541bf2a6fe2ddc7fed40cd2dae922/ProfilePage_GIF04.gif" data-mid="114568499" border="0" alt="Advanced Threat Protection profile page construction." data-caption="Advanced Threat Protection profile page construction." src="https://freight.cargo.site/w/1000/i/45cc3403690dcf459c30d656733b0fa24f9541bf2a6fe2ddc7fed40cd2dae922/ProfilePage_GIF04.gif" /> Outcomes Phase two of the profile page was accepted with positive feedbacks, the users were happy to receive a centric identity related investigation point. The success of the profile page spread to other security products with adoption of the layout, flow and the ID - miniID component&nbsp; to their experiences. ︎ Phase ThreeProfile page redesignMicrosoft 365 Security and Complience Center portal profile page App design, 2018 <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/3a3c65cdeadb481177a90dae563fa2b41010aa1362e6e383f3c9db9a5f2c8ecd/ProfilePage_phasethree_inner01.png" data-mid="114555301" border="0" alt="M365 Security and Complience Center profile page, Activities tab (1)." data-caption="M365 Security and Complience Center profile page, Activities tab (1)." src="https://freight.cargo.site/w/1000/i/3a3c65cdeadb481177a90dae563fa2b41010aa1362e6e383f3c9db9a5f2c8ecd/ProfilePage_phasethree_inner01.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/bf09b4e99d99b65dda3c17833a785993e6e27dc2e02d7e02a629a2f8537e98d2/ProfilePage_phasethree_inner06-2.png" data-mid="114570972" border="0" alt="M365 Security and Complience Center profile page, Activities tab (2)." data-caption="M365 Security and Complience Center profile page, Activities tab (2)." src="https://freight.cargo.site/w/1000/i/bf09b4e99d99b65dda3c17833a785993e6e27dc2e02d7e02a629a2f8537e98d2/ProfilePage_phasethree_inner06-2.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/6a6b7ca0241bfa6d217e1817cc7cb83c38106088e845637fa21d3b05740e664c/ProfilePage_phasethree_inner02.png" data-mid="114555302" border="0" alt="M365 Security and Complience Center profile page, Activities tab (3)." data-caption="M365 Security and Complience Center profile page, Activities tab (3)." src="https://freight.cargo.site/w/1000/i/6a6b7ca0241bfa6d217e1817cc7cb83c38106088e845637fa21d3b05740e664c/ProfilePage_phasethree_inner02.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/d8ae7933fa62aec604e2299e7a74af10c95b3e305ac080c6b6e4504c6fc410e5/ProfilePage_phasethree_inner03.png" data-mid="114555303" border="0" alt="M365 Security and Complience Center profile page, Activities tab (4)." data-caption="M365 Security and Complience Center profile page, Activities tab (4)." src="https://freight.cargo.site/w/1000/i/d8ae7933fa62aec604e2299e7a74af10c95b3e305ac080c6b6e4504c6fc410e5/ProfilePage_phasethree_inner03.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/eeee71f78f4e3bd4bec1c6b0e3f6b736aedc52af7342c236bd372b3be80fa9ad/ProfilePage_phasethree_inner04.png" data-mid="114555306" border="0" alt="M365 Security and Complience Center profile page, Activities tab (5)." data-caption="M365 Security and Complience Center profile page, Activities tab (5)." src="https://freight.cargo.site/w/1000/i/eeee71f78f4e3bd4bec1c6b0e3f6b736aedc52af7342c236bd372b3be80fa9ad/ProfilePage_phasethree_inner04.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/f1b172ca58ed9809d9e16acaf6307b85d557626992737e4213238c7a9cdedd78/ProfilePage_phasethree_inner05.png" data-mid="114555307" border="0" alt="M365 Security and Complience Center profile page, Activities tab (6)." data-caption="M365 Security and Complience Center profile page, Activities tab (6)." src="https://freight.cargo.site/w/1000/i/f1b172ca58ed9809d9e16acaf6307b85d557626992737e4213238c7a9cdedd78/ProfilePage_phasethree_inner05.png" /> The profile page in the wider Microsoft 365 SCC portal&nbsp; became a starting point of an investigation and not the investigation point itself. Consequently, the layout transformed from the existing activity deep dive to a dashboard view. The flow took the user from the page to the user activities and alerts logs in other pages,&nbsp; while high level investigation remaind in the page. The centric identity data source and a coherent flow that followed other pages was an experience that saved users many steps of transitioning from product to product. ︎Resources Click here for a deeper dive to the entire project.(Beware of the overly descriptive content, but prepare yourself for wider understanding :) Click here for an analysis of pahse one of the project. Click here for a wider look at the research results of phase one of the project. https://ziganna.me/Digital-Books-Library Wed, 14 Jul 2021 19:37:00 +0000 Ziganna https://ziganna.me/Digital-Books-Library Digital Books Library Experimental app for digital books, final graduation projectSilver winner of Indigo awards 2018 [Role] UX/UI design, Product definition ‘Bezalel’, App design, 2011 <img width="2307" height="1440" width_o="2307" height_o="1440" data-src="https://freight.cargo.site/t/original/i/c561ffb5227dbf5640b47d42307ae5dda5cab4abb3a3d4b7af9bf50c6763147d/PAG_inner00.png" data-mid="114020916" border="0" alt="App flipped view of the user's library, original covers image view" data-caption="App flipped view of the user's library, original covers image view" src="https://freight.cargo.site/w/1000/i/c561ffb5227dbf5640b47d42307ae5dda5cab4abb3a3d4b7af9bf50c6763147d/PAG_inner00.png" /> A library app for digital books. The library organizes the user’s book files in a visually informative way and reflects hers/his attributes as a reader. Demo user flow of the Digital Library app&nbsp; Layout The default display presents the user’s library inventory (number of books, writers, genres and languages in the collection) and provides an easy sorting and organization menu.&nbsp; Each empty rectangle represents a book. The default book view is colorless to allow free color coding by preference. <img width="2307" height="1440" width_o="2307" height_o="1440" data-src="https://freight.cargo.site/t/original/i/29243f5384a9f24cc49483989a1530641c0b63fdb3ddd953c812306d82be187f/PAG_inner0.png" data-mid="114020915" border="0" alt="Default library view, no user color coding" data-caption="Default library view, no user color coding" src="https://freight.cargo.site/w/1000/i/29243f5384a9f24cc49483989a1530641c0b63fdb3ddd953c812306d82be187f/PAG_inner0.png" /> CustomizationUsers can organize their library by genres, languages and almost any given parameter (such as year of publication, publisher house etc.), and color code the books to distinguish between them by any preferable color customizable view.&nbsp; Color coding can be done by parameters such as genres, languages, authors etc. And sorting by AB orders, genres, languages and a free entry field. <img width="2307" height="1440" width_o="2307" height_o="1440" data-src="https://freight.cargo.site/t/original/i/8ed2d8f685e022ba4d8f110ec09f9d2a6828257b6301dff153356be71cfc03d9/PAG_inner02.png" data-mid="114020918" border="0" data-scale="87" alt="The users can apply color coding and sort by genres, languages, ABC etc. to their books in the app" data-caption="The users can apply color coding and sort by genres, languages, ABC etc. to their books in the app" src="https://freight.cargo.site/w/1000/i/8ed2d8f685e022ba4d8f110ec09f9d2a6828257b6301dff153356be71cfc03d9/PAG_inner02.png" /> <img width="2307" height="1440" width_o="2307" height_o="1440" data-src="https://freight.cargo.site/t/original/i/f17f8e112f9e441732033847e2a3437f11aaa76a2fd996efd287171fda14d7d6/PAG_inner03.png" data-mid="114020919" border="0" data-scale="87" alt="Sort by genre library view" data-caption="Sort by genre library view" src="https://freight.cargo.site/w/1000/i/f17f8e112f9e441732033847e2a3437f11aaa76a2fd996efd287171fda14d7d6/PAG_inner03.png" /> <img width="2307" height="1440" width_o="2307" height_o="1440" data-src="https://freight.cargo.site/t/original/i/3ea7bd46d8d6f5240dd8cbe38c915f5a0e3b34c261dbaf496d1d5a7c90f4c7a1/PAG_inner04.png" data-mid="114020920" border="0" data-scale="87" alt="Sort by genre and language library view" data-caption="Sort by genre and language library view" src="https://freight.cargo.site/w/1000/i/3ea7bd46d8d6f5240dd8cbe38c915f5a0e3b34c261dbaf496d1d5a7c90f4c7a1/PAG_inner04.png" /> <img width="2307" height="1440" width_o="2307" height_o="1440" data-src="https://freight.cargo.site/t/original/i/8070024a4b585aef400f3e9e922042eb660a88f668884c1945a167cf1fda20d2/PAG_inner07.png" data-mid="114020924" border="0" data-scale="87" alt="Sort by ABC - authors library view" data-caption="Sort by ABC - authors library view" src="https://freight.cargo.site/w/1000/i/8070024a4b585aef400f3e9e922042eb660a88f668884c1945a167cf1fda20d2/PAG_inner07.png" /> Trend trackingThe color and infographic nature of the library, allows the users to follow their inventory history by genres, languages etc. and form an individual graphic identity as a reader.&nbsp; <img width="2307" height="1440" width_o="2307" height_o="1440" data-src="https://freight.cargo.site/t/original/i/f4f1cb23e364295efe6e2a74aaf52e71e652e5966431a07ea3c9e9391102d25e/PAG_inner06.png" data-mid="114020923" border="0" alt="User's inventory trend for that year focused on a single genre, monthly breakdown." data-caption="User's inventory trend for that year focused on a single genre, monthly breakdown." src="https://freight.cargo.site/w/1000/i/f4f1cb23e364295efe6e2a74aaf52e71e652e5966431a07ea3c9e9391102d25e/PAG_inner06.png" /> Social reading platform Another aspect of the app is it’s potential to become a social platform in which you can share your impressions with your friends and hand in hand read theirs.&nbsp; In the ABC page, the users can enter their remarks and impressions of the book. Once turning the ׳Shared Library׳ view, their friend’s reviews and comments on shared books are displayed. <img width="2307" height="1440" width_o="2307" height_o="1440" data-src="https://freight.cargo.site/t/original/i/588c052ede6016846277c593c688d8ec390f41673da33b9a220313ee435fa8bb/PAG_inner05.png" data-mid="114020921" border="0" data-scale="87" alt="Impressions or comments readers leave on a book can be viewed by their friends" data-caption="Impressions or comments readers leave on a book can be viewed by their friends" src="https://freight.cargo.site/w/1000/i/588c052ede6016846277c593c688d8ec390f41673da33b9a220313ee435fa8bb/PAG_inner05.png" /> <img width="2307" height="1440" width_o="2307" height_o="1440" data-src="https://freight.cargo.site/t/original/i/a8af54281c4f8c7d9e7956730196f4c7796fcf729fc24b1e6d4d21d99e7e83df/PAG_inner08.png" data-mid="114020925" border="0" data-scale="87" alt="Entering the 'Shared library' view shows friends' impressions" data-caption="Entering the 'Shared library' view shows friends' impressions" src="https://freight.cargo.site/w/1000/i/a8af54281c4f8c7d9e7956730196f4c7796fcf729fc24b1e6d4d21d99e7e83df/PAG_inner08.png" /> User interface The app was designed in the Hebrew language for the Hebrew speaking user to allow full personalization. Moreover, the app follows the literary spirit by avoiding icons and images in all UI components.&nbsp; Elements such as indicators and navigation are font originated and typography based. In the design process most icon and image based UI standards were deliberately avoided and replaced by words and text.&nbsp;(Scroll bars, color assignment UI, menu pane, search component, etc.) <img width="2307" height="1440" width_o="2307" height_o="1440" data-src="https://freight.cargo.site/t/original/i/772b00bc6a61e1c9546a6c31470b7a7162e7569460b5b718166a253c685f50ef/PAG_inner010.png" data-mid="114020927" border="0" data-scale="87" alt="Color customization menu uses labels and glyphs as controls" data-caption="Color customization menu uses labels and glyphs as controls" src="https://freight.cargo.site/w/1000/i/772b00bc6a61e1c9546a6c31470b7a7162e7569460b5b718166a253c685f50ef/PAG_inner010.png" /> <img width="2307" height="1440" width_o="2307" height_o="1440" data-src="https://freight.cargo.site/t/original/i/196b0c0f6935c39aa5d3d2d567dd298199c52e3cf88ee2c2898c0784892c33ec/PAG_inner09.png" data-mid="114020926" border="0" data-scale="87" alt="The scroll bar is conveyed as letter arrow" data-caption="The scroll bar is conveyed as letter arrow" src="https://freight.cargo.site/w/1000/i/196b0c0f6935c39aa5d3d2d567dd298199c52e3cf88ee2c2898c0784892c33ec/PAG_inner09.png" /> <img width="2307" height="1440" width_o="2307" height_o="1440" data-src="https://freight.cargo.site/t/original/i/f088752125ae02f350fb11897da02f599e85e1ed754053249ba19279615c0461/PAG_inner011.png" data-mid="114020928" border="0" data-scale="87" alt="The search bar consists of text controls" data-caption="The search bar consists of text controls" src="https://freight.cargo.site/w/1000/i/f088752125ae02f350fb11897da02f599e85e1ed754053249ba19279615c0461/PAG_inner011.png" /> Navigation Elements from the physical literature realm were metaphorically applied in the layout and navigation design, to follow the reading tradition and concept. The app’s screens and menus were created to hint a blank piece of paper.The navigation animations were inspired by the action of ׳flipping/turning a page׳. The navigation panes’ structure was driven from the concept of ׳a folded paper׳. <img width="900" height="563" width_o="900" height_o="563" data-src="https://freight.cargo.site/t/original/i/4885a73897f378812f7ddb1559dd1ac03cdb655e7831ae25d7245a7db0cf6ca4/Library_animation02_1.gif" data-mid="114023047" border="0" alt="Switching to 'Fliiped view'" data-caption="Switching to 'Fliiped view'" src="https://freight.cargo.site/w/900/i/4885a73897f378812f7ddb1559dd1ac03cdb655e7831ae25d7245a7db0cf6ca4/Library_animation02_1.gif" /> <img width="900" height="563" width_o="900" height_o="563" data-src="https://freight.cargo.site/t/original/i/39f61b245544bfd180ac96d981b7152ee362f3241ec0ead5e25bdd0c3dac2353/Library_animation06_1.gif" data-mid="114023052" border="0" alt="The bg is revealed by &quot;opening a book&quot; like animation" data-caption="The bg is revealed by &quot;opening a book&quot; like animation" src="https://freight.cargo.site/w/900/i/39f61b245544bfd180ac96d981b7152ee362f3241ec0ead5e25bdd0c3dac2353/Library_animation06_1.gif" /> <img width="900" height="563" width_o="900" height_o="563" data-src="https://freight.cargo.site/t/original/i/a58263f6aa57d12b70071efb0772481d247cf1e2854741f7c4534d16363cf4bb/Library_animation01_1.gif" data-mid="114023046" border="0" alt="App launch resembles pages being flipped inwards" data-caption="App launch resembles pages being flipped inwards" src="https://freight.cargo.site/w/900/i/a58263f6aa57d12b70071efb0772481d247cf1e2854741f7c4534d16363cf4bb/Library_animation01_1.gif" /> <img width="900" height="563" width_o="900" height_o="563" data-src="https://freight.cargo.site/t/original/i/417537662a417ab5a395160bd0394f280cf079a773b656556635a9edaa185872/Library_animation07_1.gif" data-mid="114023054" border="0" alt="Closing the sub menu mimics &quot;folding a paper&quot; action" data-caption="Closing the sub menu mimics &quot;folding a paper&quot; action" src="https://freight.cargo.site/w/900/i/417537662a417ab5a395160bd0394f280cf079a773b656556635a9edaa185872/Library_animation07_1.gif" /> <img width="900" height="563" width_o="900" height_o="563" data-src="https://freight.cargo.site/t/original/i/c8af0b853980a73f913c2482b9e73466daa494981f1ba115f5928e8cd6451680/Library_animation04_1.gif" data-mid="114023050" border="0" alt="Expanding the sub menu mimics &quot;unfolding a paper&quot; action" data-caption="Expanding the sub menu mimics &quot;unfolding a paper&quot; action" src="https://freight.cargo.site/w/900/i/c8af0b853980a73f913c2482b9e73466daa494981f1ba115f5928e8cd6451680/Library_animation04_1.gif" /> Flipped View The app’s default view is the ׳blank library׳ - the user’s book collection is displayed as colorless rectangles, sorted initially alphabetically. The default view is a platform for a potential color coding as a method of sort and management. Each rectangle in the UI represents a book file. Some of the files contain in them the book’s original front cover image. By flipping the main view, the users can explore their library from the image perspective. <img width="900" height="563" width_o="900" height_o="563" data-src="https://freight.cargo.site/t/original/i/e6cbaff36d30c6df41c690dbdf6d106e5e6a3dc27611075aea68877066a0389c/Library_animation03.gif" data-mid="114023049" border="0" alt="Navigating to the flipped view to see the original covers of the books" data-caption="Navigating to the flipped view to see the original covers of the books" src="https://freight.cargo.site/w/900/i/e6cbaff36d30c6df41c690dbdf6d106e5e6a3dc27611075aea68877066a0389c/Library_animation03.gif" /> User unique reading identity The colors the user chooses for color coding and the parameters upon which the user chooses to color code - are reflected in the background image of the library and create a unique “barcode” that distinguishes the user identity from other readers. The library background is an image that consists of a collection of rectangle stretched fragments of the book’s front covers. Books that are downloaded as files without the original cover images are represented as white (׳colorless׳) rectangles. Once the users color-code their books the ׳colorless׳ rectangles are colored in the background according to the color the users choose. Consequently, the image in the app’s background is compiled of a mixture of the ׳original׳ book stretched covers and the colors the users color codes their inventory. Each app background image is unique to that specific user since it reflects their book collection and color choices - thus creating a custom-personalized barcode of the user as a reader. <img width="3555" height="2221" width_o="3555" height_o="2221" data-src="https://freight.cargo.site/t/original/i/2eb06386d371018e6c1a0035cd43443bb3a5924ead711daf1802bdb330464ef5/PAG_Cover.jpg" data-mid="113863838" border="0" alt="&quot;Barcode&quot; image that colors according to user's color coding of the books. Serves as the app background" data-caption="&quot;Barcode&quot; image that colors according to user's color coding of the books. Serves as the app background" src="https://freight.cargo.site/w/1000/i/2eb06386d371018e6c1a0035cd43443bb3a5924ead711daf1802bdb330464ef5/PAG_Cover.jpg" /> Exploration While working on the project, I’ve tested various graphic forms, before achieving the final concept.&nbsp; Diamond Each side of the shape represents a different language, can be sorted by color genres and morf to a different shape to represents user's sorting preferences. <img width="2880" height="1410" width_o="2880" height_o="1410" data-src="https://freight.cargo.site/t/original/i/44d8967bc027784ca38a9a7eece3ce56d978608b3e446af088320ab5ee94975d/PAG_exploration01.png" data-mid="114028676" border="0" alt="Diamond shape. Various examinations of different attributes to the shape sides, like: genres, languages and user free customization" data-caption="Diamond shape. Various examinations of different attributes to the shape sides, like: genres, languages and user free customization" src="https://freight.cargo.site/w/1000/i/44d8967bc027784ca38a9a7eece3ce56d978608b3e446af088320ab5ee94975d/PAG_exploration01.png" /> Shelves Sorted by colour genres, can&nbsp; be rearranged to layers that reflect the distribution by languages. <img width="2880" height="1410" width_o="2880" height_o="1410" data-src="https://freight.cargo.site/t/original/i/ffdff73e4867ec88d4baa3b3f8cff2f930b55c41abd6f2d06c3df5c88d6db6ff/PAG_exploration02.png" data-mid="114028677" border="0" data-scale="87" alt=" Shelves shape. Left: soterd by genres with color coding, right: same, instead of height, the quantity of the genre is measured in width" data-caption=" Shelves shape. Left: soterd by genres with color coding, right: same, instead of height, the quantity of the genre is measured in width" src="https://freight.cargo.site/w/1000/i/ffdff73e4867ec88d4baa3b3f8cff2f930b55c41abd6f2d06c3df5c88d6db6ff/PAG_exploration02.png" /> <img width="2880" height="1410" width_o="2880" height_o="1410" data-src="https://freight.cargo.site/t/original/i/332f58f4bc476b17d28def4949facbca244c87319140a2105a6102c8e9c70b56/PAG_exploration03.png" data-mid="114028678" border="0" data-scale="87" alt="Shelves shape. Left: colored genres are sorted by language columns, right: multiple language rows distributed by letters of the colored genres" data-caption="Shelves shape. Left: colored genres are sorted by language columns, right: multiple language rows distributed by letters of the colored genres" src="https://freight.cargo.site/w/1000/i/332f58f4bc476b17d28def4949facbca244c87319140a2105a6102c8e9c70b56/PAG_exploration03.png" /> Cube Each book is displayed as a square, can be sorted by colour genres, and distributed to columns that represents a different language. <img width="2880" height="1410" width_o="2880" height_o="1410" data-src="https://freight.cargo.site/t/original/i/a4f2680628199486bc81212fdcbef24519c2d475d01314c7fbff5903a319a2d0/PAG_exploration04.png" data-mid="114028679" border="0" alt="Cube shape. Left: Genre color coding, middle: genres sorted by language columns,right: alphabetical distribution to rows of colored genres, by language columns" data-caption="Cube shape. Left: Genre color coding, middle: genres sorted by language columns,&lt;br&gt;right: alphabetical distribution to rows of colored genres, by language columns" src="https://freight.cargo.site/w/1000/i/a4f2680628199486bc81212fdcbef24519c2d475d01314c7fbff5903a319a2d0/PAG_exploration04.png" /> Turbine Each circle is a genre, can be sorted by colour genres and languages. On the left: each circle is a different language. On the right: each circle is a genre and language combined. <img width="2880" height="1410" width_o="2880" height_o="1410" data-src="https://freight.cargo.site/t/original/i/678e471941dab80e986cb8b79ff797f38ec11da70c67fb2c7e6061b7726a2954/PAG_exploration05.png" data-mid="114028680" border="0" alt="Turbine shape. Left: each circle is a genre, right top: each circle is a language with genre color coding,right bottom: each circle is a genre while the inner circle radius division displays language differences" data-caption="Turbine shape. Left: each circle is a genre, right top: each circle is a language with genre color coding,&lt;br&gt;right bottom: each circle is a genre while the inner circle radius division displays language differences" src="https://freight.cargo.site/w/1000/i/678e471941dab80e986cb8b79ff797f38ec11da70c67fb2c7e6061b7726a2954/PAG_exploration05.png" /> Freestyle Exhibits the mutual reference fields of all the books in the library, while the color coding represents the genres. <img width="2880" height="1410" width_o="2880" height_o="1410" data-src="https://freight.cargo.site/t/original/i/4bbcbadf6d18ae0c5d2b2d34896eb9cdcc0c53c7729b280802fb1e39696f3d81/PAG_exploration07.png" data-mid="114028682" border="0" alt="Freestyle shape. Each color sphere is a genre while the directional expantion indicates mutual parameters of the books" data-caption="Freestyle shape. Each color sphere is a genre while the directional expantion indicates mutual parameters of the books" src="https://freight.cargo.site/w/1000/i/4bbcbadf6d18ae0c5d2b2d34896eb9cdcc0c53c7729b280802fb1e39696f3d81/PAG_exploration07.png" /> Click here for a deeper dive to the project (Mesmerizing beauty and insightful mind triggering delight is insured :) https://ziganna.me/Anomalies-Detection Sat, 24 Jul 2021 15:46:28 +0000 Ziganna https://ziganna.me/Anomalies-Detection Anomalies Detection Data insights driven by Artificial Intelligence [Role] Product design lead, experience definition, Consultant Power BI, App design, 2020 <img width="3000" height="1469" width_o="3000" height_o="1469" data-src="https://freight.cargo.site/t/original/i/fb1749ab885ca6460fd1432412c9d9c6475113e1569147b59ab3bed40a429268/AnomaliesDetection_inner01.jpg" data-mid="117986087" border="0" alt="Anomalies detection description panel for March 19' data point." data-caption="Anomalies detection description panel for March 19' data point." src="https://freight.cargo.site/w/1000/i/fb1749ab885ca6460fd1432412c9d9c6475113e1569147b59ab3bed40a429268/AnomaliesDetection_inner01.jpg" /> <img width="3000" height="1469" width_o="3000" height_o="1469" data-src="https://freight.cargo.site/t/original/i/b914b4b37c5ad3209413c999c5982da3d6c991591e9153407c385187febca9d1/AnomaliesDetection_inner02.jpg" data-mid="117986088" border="0" alt="Anomalies Detection in Power BI mobile, mobile portrait." data-caption="Anomalies Detection in Power BI mobile, mobile portrait." src="https://freight.cargo.site/w/1000/i/b914b4b37c5ad3209413c999c5982da3d6c991591e9153407c385187febca9d1/AnomaliesDetection_inner02.jpg" /> <img width="3000" height="1469" width_o="3000" height_o="1469" data-src="https://freight.cargo.site/t/original/i/22c402336f35a3332d520ca3bafb7ac6b285ef416d5a5ae9042d849a08d0bb71/AnomaliesDetection_inner03.jpg" data-mid="117986089" border="0" alt="Anomalies Detection in Power BI mobile, mobile landscape." data-caption="Anomalies Detection in Power BI mobile, mobile landscape." src="https://freight.cargo.site/w/1000/i/22c402336f35a3332d520ca3bafb7ac6b285ef416d5a5ae9042d849a08d0bb71/AnomaliesDetection_inner03.jpg" /> <img width="3000" height="1469" width_o="3000" height_o="1469" data-src="https://freight.cargo.site/t/original/i/4f06f130aadf96f7699f4ed546ee4d5dd1ec01ec74a684380105ef9e3ccd1a62/AnomaliesDetection_inner04.jpg" data-mid="117986090" border="0" alt="Anomalies Detection in Power BI mobile, tablet portrait." data-caption="Anomalies Detection in Power BI mobile, tablet portrait." src="https://freight.cargo.site/w/1000/i/4f06f130aadf96f7699f4ed546ee4d5dd1ec01ec74a684380105ef9e3ccd1a62/AnomaliesDetection_inner04.jpg" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/cfcf68972623a878925f1ddc5977d1bbe78fbc53f09dff340f4bf1b1ec60e1ca/AnomaliesDetection_inner05.jpg" data-mid="117986091" border="0" alt="Anomalies Detection in Power BI mobile, tablet landscape." data-caption="Anomalies Detection in Power BI mobile, tablet landscape." src="https://freight.cargo.site/w/1000/i/cfcf68972623a878925f1ddc5977d1bbe78fbc53f09dff340f4bf1b1ec60e1ca/AnomaliesDetection_inner05.jpg" /> <img width="3000" height="1469" width_o="3000" height_o="1469" data-src="https://freight.cargo.site/t/original/i/fb1749ab885ca6460fd1432412c9d9c6475113e1569147b59ab3bed40a429268/AnomaliesDetection_inner01.jpg" data-mid="117986087" border="0" src="https://freight.cargo.site/w/1000/i/fb1749ab885ca6460fd1432412c9d9c6475113e1569147b59ab3bed40a429268/AnomaliesDetection_inner01.jpg" /> <img width="3000" height="1469" width_o="3000" height_o="1469" data-src="https://freight.cargo.site/t/original/i/b914b4b37c5ad3209413c999c5982da3d6c991591e9153407c385187febca9d1/AnomaliesDetection_inner02.jpg" data-mid="117986088" border="0" src="https://freight.cargo.site/w/1000/i/b914b4b37c5ad3209413c999c5982da3d6c991591e9153407c385187febca9d1/AnomaliesDetection_inner02.jpg" /> <img width="3000" height="1469" width_o="3000" height_o="1469" data-src="https://freight.cargo.site/t/original/i/22c402336f35a3332d520ca3bafb7ac6b285ef416d5a5ae9042d849a08d0bb71/AnomaliesDetection_inner03.jpg" data-mid="117986089" border="0" src="https://freight.cargo.site/w/1000/i/22c402336f35a3332d520ca3bafb7ac6b285ef416d5a5ae9042d849a08d0bb71/AnomaliesDetection_inner03.jpg" /> <img width="3000" height="1469" width_o="3000" height_o="1469" data-src="https://freight.cargo.site/t/original/i/4f06f130aadf96f7699f4ed546ee4d5dd1ec01ec74a684380105ef9e3ccd1a62/AnomaliesDetection_inner04.jpg" data-mid="117986090" border="0" src="https://freight.cargo.site/w/1000/i/4f06f130aadf96f7699f4ed546ee4d5dd1ec01ec74a684380105ef9e3ccd1a62/AnomaliesDetection_inner04.jpg" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/cfcf68972623a878925f1ddc5977d1bbe78fbc53f09dff340f4bf1b1ec60e1ca/AnomaliesDetection_inner05.jpg" data-mid="117986091" border="0" src="https://freight.cargo.site/w/1000/i/cfcf68972623a878925f1ddc5977d1bbe78fbc53f09dff340f4bf1b1ec60e1ca/AnomaliesDetection_inner05.jpg" /> Anomaly detection is a feature introduced in Power BI to enhance users understanding of their data by automatically detecting anomalies and providing explanations to help with root cause analysis. The feature is based on an AI engine which learns the data and maps the expected range of values. When a value goes outside the expected boundary, it is marked as an anomaly. <img width="500" height="950" width_o="500" height_o="950" data-src="https://freight.cargo.site/t/original/i/7e13ceed952d869e5e98a3cf2495b9154410bf8e7194fcc59ab594dcdbb94e34/Comp-2_2.gif" data-mid="115029066" border="0" alt="Tapping the anomaly point on the chart opens the anomalies panel with descriptions." data-caption="Tapping the anomaly point on the chart opens the anomalies panel with descriptions." src="https://freight.cargo.site/w/500/i/7e13ceed952d869e5e98a3cf2495b9154410bf8e7194fcc59ab594dcdbb94e34/Comp-2_2.gif" /> <img width="400" height="760" width_o="400" height_o="760" data-src="https://freight.cargo.site/t/original/i/380cb9b8dc7fa5d3542541087b721fc20321eade6821028198b3380d09a7d648/Comp-4_1_2.gif" data-mid="118017127" border="0" alt="When an anomaly is detected, the user receives a push notification." data-caption="When an anomaly is detected, the user receives a push notification." src="https://freight.cargo.site/w/400/i/380cb9b8dc7fa5d3542541087b721fc20321eade6821028198b3380d09a7d648/Comp-4_1_2.gif" /> <img width="950" height="950" width_o="950" height_o="950" data-src="https://freight.cargo.site/t/original/i/5778c983fb7c096967cb15c6069497a2fe582104e1edd2b4e68285507aa62668/Comp-5_1.gif" data-mid="115026020" border="0" alt="The anomalies panel is suited for portrait and landscape views." data-caption="The anomalies panel is suited for portrait and landscape views." src="https://freight.cargo.site/w/950/i/5778c983fb7c096967cb15c6069497a2fe582104e1edd2b4e68285507aa62668/Comp-5_1.gif" /> <img width="500" height="950" width_o="500" height_o="950" data-src="https://freight.cargo.site/t/original/i/d874ca2cd8b2f3bf9cf174f48d862d68233f5e0ad747d9b06b713d9608a3b7d1/Comp-3_1.gif" data-mid="115026018" border="0" alt="Each data point displays different anomaly explanation. Some result in empty states." data-caption="Each data point displays different anomaly explanation. Some result in empty states." src="https://freight.cargo.site/w/500/i/d874ca2cd8b2f3bf9cf174f48d862d68233f5e0ad747d9b06b713d9608a3b7d1/Comp-3_1.gif" /> Designing the ExperienceWhen the AI engine triggers the anomalies, it also provides useful outputs that can be utilized in the design and enrich both the experience and user understanding of the insights. The engine maps the norm range, the data points that are above or below the expected range and uses natural language to produce explanations of the anomalies that are found in the data, along with the factors associated with that anomaly sorted by its explanatory strength. Here is the construction process of the feature in mobile ︎ To better understand the design and the construction process, click here for a recording of a talk I gave on the feature work. OpportunityEach year, ׳Gartner׳ (leading business research and trend analysis company) delivers markets analysis and provides a map of strengths and opportunities of the products in those markets. ׳Automated Anomaly׳ was recognized as a growth opportunity for Power BI and triggered the creation of the Anomalies detection feature. (From&nbsp;Product Roadmap Priorities: Modern Business Intelligence Platform&nbsp;&amp; Gartner Top 10 Data and Analytics Trends for 2021). <img width="2400" height="1880" width_o="2400" height_o="1880" data-src="https://freight.cargo.site/t/original/i/e5da27ef4847a2551dbc8b74146481a0b506fba3076e0f27a0bec156c1f77ea0/AnomaliesDetection_inner06_3.png" data-mid="115022868" border="0" alt="Mapping of BI products and their key capabilities." data-caption="Mapping of BI products and their key capabilities." src="https://freight.cargo.site/w/1000/i/e5da27ef4847a2551dbc8b74146481a0b506fba3076e0f27a0bec156c1f77ea0/AnomaliesDetection_inner06_3.png" /> <img width="2400" height="1880" width_o="2400" height_o="1880" data-src="https://freight.cargo.site/t/original/i/a518d919423a743bd47dfcad171d6c961fb95c9ade87881572a2c2920331839f/AnomaliesDetection_inner07_3.png" data-mid="115022869" border="0" alt="Gartner &quot;Product Roadmap Priorities: Modern Business Intelligence Platforms&quot; report that marks Advanced Analytics as the leading trend." data-caption="Gartner &quot;Product Roadmap Priorities: Modern Business Intelligence Platforms&quot; report that marks Advanced Analytics as the leading trend." src="https://freight.cargo.site/w/1000/i/a518d919423a743bd47dfcad171d6c961fb95c9ade87881572a2c2920331839f/AnomaliesDetection_inner07_3.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/9368b5ca94f17eae2b5b172e4c0c977b3d898fae0e792685986343847f38dd98/AnomaliesDetection_inner08_2.png" data-mid="115021581" border="0" alt="Gartner &quot;Top Priorities for IT: Leadership Vision for 2021&quot; that positions Analytics, AI and Automation as leading technologies for products." data-caption="Gartner &quot;Top Priorities for IT: Leadership Vision for 2021&quot; that positions Analytics, AI and Automation as leading technologies for products." src="https://freight.cargo.site/w/1000/i/9368b5ca94f17eae2b5b172e4c0c977b3d898fae0e792685986343847f38dd98/AnomaliesDetection_inner08_2.png" /> Outcomes The feature helps users to find statistical anomalies in their data, provides possible explanations for these anomalies (based on AI insights) and tracks upcoming anomalies. Moreover, it positions Power BI as a lead in the automated insights realm. For the mobile scenario, ׳on the go׳, this was especially useful since the visually overloaded user can now enjoy a high-level view of their data through the insights. A talk I gave about the Anomalies Detection design creation Click here for a deeper dive to the project&nbsp;(More thoughtd on design for the BI world&nbsp; is inside :) https://ziganna.me/Navigation-Tree Sat, 31 Jul 2021 09:15:04 +0000 Ziganna https://ziganna.me/Navigation-Tree Navigation TreeEasy navigation and content orientation [Role] Lead product designer, Experience definition Power BI, Information design, 2020 <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/5ecf55d828bb62555df6041a04fe783f77625a80a0c8fa3b62d36f0d05b109a8/NavTree_inner01.jpg" data-mid="117953201" border="0" alt="&quot;Customer Profitability&quot; report navigation tree. Showing the report has 3 pages, the user is on page 2." data-caption="&quot;Customer Profitability&quot; report navigation tree. Showing the report has 3 pages, the user is on page 2." src="https://freight.cargo.site/w/1000/i/5ecf55d828bb62555df6041a04fe783f77625a80a0c8fa3b62d36f0d05b109a8/NavTree_inner01.jpg" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/c88790612eaa745e91640d89332237999f4c2d9b6ce3a6496553f8c633121b21/NavTree_inner02.jpg" data-mid="117953202" border="0" alt="&quot;BIMobileUsage&quot; report navigation tree. Showing the report has 14 pages, the user is on page 1.The report is located in an &quot;App&quot; with other items, showing them in the long scroll." data-caption="&quot;BIMobileUsage&quot; report navigation tree. Showing the report has 14 pages, the user is on page 1.&lt;br&gt;The report is located in an &quot;App&quot; with other items, showing them in the long scroll." src="https://freight.cargo.site/w/1000/i/c88790612eaa745e91640d89332237999f4c2d9b6ce3a6496553f8c633121b21/NavTree_inner02.jpg" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/40cf6b02e721c61035521a44ab200d25758622d836b337e3ad8bff6d8f2eaf68/NavTree_inner03.jpg" data-mid="117953203" border="0" alt="&quot;Committed Features&quot; report navigation tree. Showing the report has 3 pages, the user is on page 1. Landscape view." data-caption="&quot;Committed Features&quot; report navigation tree. Showing the report has 3 pages, the user is on page 1. Landscape view." src="https://freight.cargo.site/w/1000/i/40cf6b02e721c61035521a44ab200d25758622d836b337e3ad8bff6d8f2eaf68/NavTree_inner03.jpg" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/73def20d70e560b0dd08af84b6f41f26e4fdaad366b8d87bdb5875a8bad1c087/NavTree_inner04.jpg" data-mid="117953204" border="0" alt="&quot;Customer Profitability&quot; report navigation tree. Showing the report has 3 pages, the user is on page 2. Dark mode." data-caption="&quot;Customer Profitability&quot; report navigation tree. Showing the report has 3 pages, the user is on page 2. Dark mode." src="https://freight.cargo.site/w/1000/i/73def20d70e560b0dd08af84b6f41f26e4fdaad366b8d87bdb5875a8bad1c087/NavTree_inner04.jpg" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/5ecf55d828bb62555df6041a04fe783f77625a80a0c8fa3b62d36f0d05b109a8/NavTree_inner01.jpg" data-mid="117953201" border="0" src="https://freight.cargo.site/w/1000/i/5ecf55d828bb62555df6041a04fe783f77625a80a0c8fa3b62d36f0d05b109a8/NavTree_inner01.jpg" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/c88790612eaa745e91640d89332237999f4c2d9b6ce3a6496553f8c633121b21/NavTree_inner02.jpg" data-mid="117953202" border="0" src="https://freight.cargo.site/w/1000/i/c88790612eaa745e91640d89332237999f4c2d9b6ce3a6496553f8c633121b21/NavTree_inner02.jpg" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/40cf6b02e721c61035521a44ab200d25758622d836b337e3ad8bff6d8f2eaf68/NavTree_inner03.jpg" data-mid="117953203" border="0" src="https://freight.cargo.site/w/1000/i/40cf6b02e721c61035521a44ab200d25758622d836b337e3ad8bff6d8f2eaf68/NavTree_inner03.jpg" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/73def20d70e560b0dd08af84b6f41f26e4fdaad366b8d87bdb5875a8bad1c087/NavTree_inner04.jpg" data-mid="117953204" border="0" src="https://freight.cargo.site/w/1000/i/73def20d70e560b0dd08af84b6f41f26e4fdaad366b8d87bdb5875a8bad1c087/NavTree_inner04.jpg" /> The Navigation Tree is a top drawer UI component that make it easier for users to understand their content hierarchy and to navigate between items quickly.&nbsp; <img width="324" height="699" width_o="324" height_o="699" data-src="https://freight.cargo.site/t/original/i/abc274454a8ea1df29dd06ec3aec1849bf38276c7ee90081481541f8a866f386/NavTree_anim16_dark.gif" data-mid="118008252" border="0" alt="Navigation Tree of a report with 5 pages. User navigated between pages. Dark mode." data-caption="Navigation Tree of a report with 5 pages. User navigated between pages. Dark mode." src="https://freight.cargo.site/w/324/i/abc274454a8ea1df29dd06ec3aec1849bf38276c7ee90081481541f8a866f386/NavTree_anim16_dark.gif" /> MotivationIn the rich data BI world, the ability to easily find relevant content and to navigate between related items, has become critical for user productivity and satisfaction. Periodic product researches on navigation flows in the app, and overall experience showed that users found it challenging to navigate inside an item and outside between multiple items. <img width="3400" height="1880" width_o="3400" height_o="1880" data-src="https://freight.cargo.site/t/original/i/e932f956bfab7340d326753cc24440edd8cdc5accf4e1882b79cdf278c2ce640/NavTree_inner05.png" data-mid="116674654" border="0" alt="&quot;Navigation Usability Study&quot;, Nov 2019, Summary results." data-caption="&quot;Navigation Usability Study&quot;, Nov 2019, Summary results." src="https://freight.cargo.site/w/1000/i/e932f956bfab7340d326753cc24440edd8cdc5accf4e1882b79cdf278c2ce640/NavTree_inner05.png" /> <img width="3400" height="1880" width_o="3400" height_o="1880" data-src="https://freight.cargo.site/t/original/i/f84727338c8403784517153a2e7b10d2df117f2303e79f818a891ca3531ed5a5/NavTree_inner09.png" data-mid="116675543" border="0" alt="&quot;Mobile Benchmark Study&quot;, Jul 2019, Summary results." data-caption="&quot;Mobile Benchmark Study&quot;, Jul 2019, Summary results." src="https://freight.cargo.site/w/1000/i/f84727338c8403784517153a2e7b10d2df117f2303e79f818a891ca3531ed5a5/NavTree_inner09.png" /> <img width="3400" height="1880" width_o="3400" height_o="1880" data-src="https://freight.cargo.site/t/original/i/7f83a3f811887c2549cccfa2f42af02fdf2940e6307abdd5a832c7916bdb522b/NavTree_inner06.png" data-mid="116674655" border="0" src="https://freight.cargo.site/w/1000/i/7f83a3f811887c2549cccfa2f42af02fdf2940e6307abdd5a832c7916bdb522b/NavTree_inner06.png" /> <img width="3400" height="1880" width_o="3400" height_o="1880" data-src="https://freight.cargo.site/t/original/i/88bfe0617c65ca54c112fe79a63fd282c4b61d2b585880674519ad4a71a4c5bd/NavTree_inner07.png" data-mid="116674656" border="0" src="https://freight.cargo.site/w/1000/i/88bfe0617c65ca54c112fe79a63fd282c4b61d2b585880674519ad4a71a4c5bd/NavTree_inner07.png" /> <img width="3400" height="1880" width_o="3400" height_o="1880" data-src="https://freight.cargo.site/t/original/i/934da05d12515d7c47f43d2ba23b0672350c26994d638632b4194d9ea8547a7c/NavTree_inner08.png" data-mid="116674657" border="0" src="https://freight.cargo.site/w/1000/i/934da05d12515d7c47f43d2ba23b0672350c26994d638632b4194d9ea8547a7c/NavTree_inner08.png" /> Goals Improve user's orientation in the app, by visualizing the structure of artifacts. Respond to users' feedback and research findings with regards to navigation and pagination. ︎ Defininng RequirenmentsResearch findings solidified the requirenments for navigation experience improvement:&nbsp;Add indication for number of pages in a report.Align the navigation experience across all types of items and hierarchies (both for the basic report unit and the complex ׳App׳ bundle).Improve the hierarchy visualization in the current top drawer component. ︎ Design Conceptualization The design process focused on creating a structure for the navigation component that can withhold both the simple navigation pattern: report with one page or multiple pages and the complex navigation pattern: ׳App׳* that contains several levels of hierarchy and items. *App = A bundle/folder which contains different types of items and can have sub-folders with items.&nbsp; <img width="3006" height="1880" width_o="3006" height_o="1880" data-src="https://freight.cargo.site/t/original/i/de14fcf037d1c822eab1527ea45f4ddabac72b82b2011b918273b6ed8cee8657/NavTree_inner16_2.png" data-mid="116744240" border="0" alt="Navigation Tree basic unit structure." data-caption="Navigation Tree basic unit structure." src="https://freight.cargo.site/w/1000/i/de14fcf037d1c822eab1527ea45f4ddabac72b82b2011b918273b6ed8cee8657/NavTree_inner16_2.png" /> ︎ The structure and hierarchical layout was tested for the report item. <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/53340199b7957eb8e7be5259cd334a707976f381bcd369c405ff5452d84370f6/NavTree_inner17.png" data-mid="116708607" border="0" alt="Navigation Tree of a report with 1 page, basic unit." data-caption="Navigation Tree of a report with 1 page, basic unit." src="https://freight.cargo.site/w/1000/i/53340199b7957eb8e7be5259cd334a707976f381bcd369c405ff5452d84370f6/NavTree_inner17.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/e4fea53bea67be7e4320216706da45e05b72108aac0bbf914cf2fc2340545d10/NavTree_inner18.png" data-mid="116744701" border="0" alt="Navigation Tree of a report with 3 pages, basic unit." data-caption="Navigation Tree of a report with 3 pages, basic unit." src="https://freight.cargo.site/w/1000/i/e4fea53bea67be7e4320216706da45e05b72108aac0bbf914cf2fc2340545d10/NavTree_inner18.png" /> <img width="1200" height="950" width_o="1200" height_o="950" data-src="https://freight.cargo.site/t/original/i/a8a892a4b1458a1dc6639c5973269e3b1ed7664b88537eeef6ac4a48228e470d/NavTree_anim11.gif" data-mid="116706941" border="0" src="https://freight.cargo.site/w/1000/i/a8a892a4b1458a1dc6639c5973269e3b1ed7664b88537eeef6ac4a48228e470d/NavTree_anim11.gif" /> <img width="1200" height="950" width_o="1200" height_o="950" data-src="https://freight.cargo.site/t/original/i/fe57700c078a0dff2944e0373420e9edcaa947acd705bb1a0818c088ab6b7007/NavTree_anim12.gif" data-mid="116706942" border="0" src="https://freight.cargo.site/w/1000/i/fe57700c078a0dff2944e0373420e9edcaa947acd705bb1a0818c088ab6b7007/NavTree_anim12.gif" /> ︎ And for the ׳App׳ various content hierarchy types: An ׳App׳ with multuple items (simple hierarchy).An ׳App׳ with sub-sections that also contain multiple items (complex hierarchy). <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/ea72791dc77aaf95c9bd2f364812b30d7549ebb5951d4cdbad6422e3f3a1fbbb/NavTree_inner19.png" data-mid="116631612" border="0" alt="Navigation Tree of a report with 14 pages, in an &quot;App&quot; with 14 items, 01." data-caption="Navigation Tree of a report with 14 pages, in an &quot;App&quot; with 14 items, 01." src="https://freight.cargo.site/w/1000/i/ea72791dc77aaf95c9bd2f364812b30d7549ebb5951d4cdbad6422e3f3a1fbbb/NavTree_inner19.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/ff1e70f62340de0f0901488df3c0301e76e8fafe2d192588483857267cb2c1dc/NavTree_inner20.png" data-mid="116631613" border="0" alt="Navigation Tree of a report with 14 pages, in an &quot;App&quot; with 14 items, 02." data-caption="Navigation Tree of a report with 14 pages, in an &quot;App&quot; with 14 items, 02." src="https://freight.cargo.site/w/1000/i/ff1e70f62340de0f0901488df3c0301e76e8fafe2d192588483857267cb2c1dc/NavTree_inner20.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/69cfcef71b743992211f5a61a7279eed30d3c7e424eb1c8daefbf37693d2f933/NavTree_inner21.png" data-mid="116631614" border="0" alt="Navigation Tree of a report with 14 pages, in an &quot;App&quot; with 14 items, 03." data-caption="Navigation Tree of a report with 14 pages, in an &quot;App&quot; with 14 items, 03." src="https://freight.cargo.site/w/1000/i/69cfcef71b743992211f5a61a7279eed30d3c7e424eb1c8daefbf37693d2f933/NavTree_inner21.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/73b2d8f04ebd6965de442ab394144beaad12213ba89f6a2ce6c235d3ceae5895/NavTree_inner25.png" data-mid="116708609" border="0" alt="Navigation Tree of a report with 3 pages, in an &quot;App&quot; with 12 items and 3 sub-sections with items, 01." data-caption="Navigation Tree of a report with 3 pages, in an &quot;App&quot; with 12 items and 3 sub-sections with items, 01." src="https://freight.cargo.site/w/1000/i/73b2d8f04ebd6965de442ab394144beaad12213ba89f6a2ce6c235d3ceae5895/NavTree_inner25.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/1996ac1b14f2ac2f4edf5f8795d1b75d0dc5aa9356c76cd7956c15cdb1690c68/NavTree_inner26.png" data-mid="116708610" border="0" alt="Navigation Tree of a report with 3 pages, in an &quot;App&quot; with 12 items and 3 sub-sections with items, 02." data-caption="Navigation Tree of a report with 3 pages, in an &quot;App&quot; with 12 items and 3 sub-sections with items, 02." src="https://freight.cargo.site/w/1000/i/1996ac1b14f2ac2f4edf5f8795d1b75d0dc5aa9356c76cd7956c15cdb1690c68/NavTree_inner26.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/72816e85026b462f21b5eed3e7843ace210d1c41ad3d0aa5bd6c8026186f5f2d/NavTree_inner27.png" data-mid="116708611" border="0" alt="Navigation Tree of a report with 3 pages, in an &quot;App&quot; with 12 items and 3 sub-sections with items, 03." data-caption="Navigation Tree of a report with 3 pages, in an &quot;App&quot; with 12 items and 3 sub-sections with items, 03." src="https://freight.cargo.site/w/1000/i/72816e85026b462f21b5eed3e7843ace210d1c41ad3d0aa5bd6c8026186f5f2d/NavTree_inner27.png" /> <img width="2180" height="4120" width_o="2180" height_o="4120" data-src="https://freight.cargo.site/t/original/i/c55608fef59592e2eba792154ca838710b4fc0241a847f9471fe0e5ad1810ab3/NavTree_inner24_1.png" data-mid="116707607" border="0" alt="Navigation Tree of a report with 3 pages, in an &quot;App&quot; with 12 items and 3 sub-sections with items, full view." data-caption="Navigation Tree of a report with 3 pages, in an &quot;App&quot; with 12 items and 3 sub-sections with items, full view." src="https://freight.cargo.site/w/1000/i/c55608fef59592e2eba792154ca838710b4fc0241a847f9471fe0e5ad1810ab3/NavTree_inner24_1.png" /> <img width="2180" height="4120" width_o="2180" height_o="4120" data-src="https://freight.cargo.site/t/original/i/3cd85190f47e094ac1923650ca3f64b3bac69ecbda7a3da164e64977ac3cf93e/NavTree_inner22_1.png" data-mid="116707295" border="0" alt="Navigation Tree of a report with 14 pages, in an &quot;App&quot; with 14 items, full view." data-caption="Navigation Tree of a report with 14 pages, in an &quot;App&quot; with 14 items, full view." src="https://freight.cargo.site/w/1000/i/3cd85190f47e094ac1923650ca3f64b3bac69ecbda7a3da164e64977ac3cf93e/NavTree_inner22_1.png" /> <img width="1011" height="800" width_o="1011" height_o="800" data-src="https://freight.cargo.site/t/original/i/6adbcece302d0bc094bcb5759e3e4983f04ffea44b9d408daab4b684d70095d2/NavTree_anim14.gif" data-mid="116707231" border="0" src="https://freight.cargo.site/w/1000/i/6adbcece302d0bc094bcb5759e3e4983f04ffea44b9d408daab4b684d70095d2/NavTree_anim14.gif" /> <img width="1011" height="800" width_o="1011" height_o="800" data-src="https://freight.cargo.site/t/original/i/5856197181bc0b41a23a2f42de5d560bb403edb75fdfb92be157519e15c8fc66/NavTree_anim13.gif" data-mid="116707230" border="0" src="https://freight.cargo.site/w/1000/i/5856197181bc0b41a23a2f42de5d560bb403edb75fdfb92be157519e15c8fc66/NavTree_anim13.gif" /> Redesign Outcomes The Navigation tree was released in August 2020 and met rising adoption rates. Telemetry shows that the usage of the Navigation tree component is in a steady rise month after month. <img width="3400" height="1880" width_o="3400" height_o="1880" data-src="https://freight.cargo.site/t/original/i/b9c20c042d5b08e7337636c72563dd29f214f02092e1da7a4afdfc04918366f2/NavTree_inner15.png" data-mid="116674664" border="0" alt="Snapshot from &quot;Mobile Features Telemetry&quot; report, showing the continuous rise in Navigation Tree usage." data-caption="Snapshot from &quot;Mobile Features Telemetry&quot; report, showing the continuous rise in Navigation Tree usage." src="https://freight.cargo.site/w/1000/i/b9c20c042d5b08e7337636c72563dd29f214f02092e1da7a4afdfc04918366f2/NavTree_inner15.png" /> In addition, a user research in 2021, showed significant improvements in the areas of navigation (previously marked as challenging for users) that were addressed with the Navigation Tree release. <img width="3400" height="1880" width_o="3400" height_o="1880" data-src="https://freight.cargo.site/t/original/i/5102a25e4f1b8867ba38804fe15707557a934c216e4cca8be29b89327defa893/NavTree_inner10-2.png" data-mid="118006369" border="0" alt="&quot;Mobile Benchmark Study&quot;, Mar 2021, Summary results." data-caption="&quot;Mobile Benchmark Study&quot;, Mar 2021, Summary results." src="https://freight.cargo.site/w/1000/i/5102a25e4f1b8867ba38804fe15707557a934c216e4cca8be29b89327defa893/NavTree_inner10-2.png" /> <img width="3400" height="1880" width_o="3400" height_o="1880" data-src="https://freight.cargo.site/t/original/i/f84727338c8403784517153a2e7b10d2df117f2303e79f818a891ca3531ed5a5/NavTree_inner09.png" data-mid="116675543" border="0" alt="&quot;Mobile Benchmark Study&quot;, Jul 2019, Summary results." data-caption="&quot;Mobile Benchmark Study&quot;, Jul 2019, Summary results." src="https://freight.cargo.site/w/1000/i/f84727338c8403784517153a2e7b10d2df117f2303e79f818a891ca3531ed5a5/NavTree_inner09.png" /> <img width="3400" height="1880" width_o="3400" height_o="1880" data-src="https://freight.cargo.site/t/original/i/fcbf1bd7fb13021d895ed5a89d31324fcc9b2c73d72e860b594abc979a8d4c18/NavTree_inner11.png" data-mid="116674660" border="0" src="https://freight.cargo.site/w/1000/i/fcbf1bd7fb13021d895ed5a89d31324fcc9b2c73d72e860b594abc979a8d4c18/NavTree_inner11.png" /> <img width="3400" height="1880" width_o="3400" height_o="1880" data-src="https://freight.cargo.site/t/original/i/67b0dfa2dbb9162aea27f4c844872698c8ea4b9ba8ab4f0b4bb28d6bfebf1824/NavTree_inner14.png" data-mid="116675544" border="0" src="https://freight.cargo.site/w/1000/i/67b0dfa2dbb9162aea27f4c844872698c8ea4b9ba8ab4f0b4bb28d6bfebf1824/NavTree_inner14.png" /> <img width="3400" height="1880" width_o="3400" height_o="1880" data-src="https://freight.cargo.site/t/original/i/d781e968430f0f5620b0dc84dbad65378aa8b73fe1ae458613306b03576be086/NavTree_inner13.png" data-mid="116674662" border="0" src="https://freight.cargo.site/w/1000/i/d781e968430f0f5620b0dc84dbad65378aa8b73fe1ae458613306b03576be086/NavTree_inner13.png" /> <img width="3400" height="1880" width_o="3400" height_o="1880" data-src="https://freight.cargo.site/t/original/i/985f848d048d0b6087734dab465ded0a3a24ac632e915aa88e6a0999276c0e56/NavTree_inner12.png" data-mid="116674661" border="0" src="https://freight.cargo.site/w/1000/i/985f848d048d0b6087734dab465ded0a3a24ac632e915aa88e6a0999276c0e56/NavTree_inner12.png" /> Insights The Navigation Tree was a successful design use case. The layout, IA and flows created within the component were able to scale and display many types of content hierarchy variations without additional customization. Moreover, it was a delightful and satisfying experience to tackle in the product due to the value its improvement provided the users. <img width="500" height="950" width_o="500" height_o="950" data-src="https://freight.cargo.site/t/original/i/4dbeb6efe8a5c3ff5b5429ecc69288872397c8ea43db38d1bebf18ac5e30401c/NavTree_anim05.gif" data-mid="116632672" border="0" alt="&quot;Mobile Optimized&quot; Navigation Tree, showing 2 report pages." data-caption="&quot;Mobile Optimized&quot; Navigation Tree, showing 2 report pages." src="https://freight.cargo.site/w/500/i/4dbeb6efe8a5c3ff5b5429ecc69288872397c8ea43db38d1bebf18ac5e30401c/NavTree_anim05.gif" /> <img width="758" height="800" width_o="758" height_o="800" data-src="https://freight.cargo.site/t/original/i/c6290353fc09c56f6cbabf55405be1fb4523b1382a016fb74e164d8517aa712e/NavTree_anim06.gif" data-mid="116632673" border="0" alt="&quot;Bugdroid is in the house&quot; Navigation Tree, showing 3 report pages.Portrait and landscape views." data-caption="&quot;Bugdroid is in the house&quot; Navigation Tree, showing 3 report pages.&lt;br&gt;Portrait and landscape views." src="https://freight.cargo.site/w/758/i/c6290353fc09c56f6cbabf55405be1fb4523b1382a016fb74e164d8517aa712e/NavTree_anim06.gif" /> <img width="500" height="950" width_o="500" height_o="950" data-src="https://freight.cargo.site/t/original/i/33405429c6f9bed367f88d9e543bde9e779d6218c53e351360062cad6af8115c/NavTree_anim09.gif" data-mid="116668591" border="0" alt="&quot;Allocation Report&quot; Navigation Tree located in &quot;Header&quot; app with other items and sub-sections, showing 4 report pages." data-caption="&quot;Allocation Report&quot; Navigation Tree located in &quot;Header&quot; app with other items and sub-sections, showing 4 report pages." src="https://freight.cargo.site/w/500/i/33405429c6f9bed367f88d9e543bde9e779d6218c53e351360062cad6af8115c/NavTree_anim09.gif" /> https://ziganna.me/HoloLens-II Sat, 10 Jul 2021 13:17:18 +0000 Ziganna https://ziganna.me/HoloLens-II HoloLens II app A mixed reality app presenting data in an immersive environment [Role] AR design, Art direction Power BI, AR design, 2020 <img width="1920" height="1080" width_o="1920" height_o="1080" data-src="https://freight.cargo.site/t/original/i/f7dd191ec1361d8073223e336e79251779095b36b7b9538cfe7033bc8d172c06/HL2_Cover01.png" data-mid="113519293" border="0" alt="Screen capture from HL2 device of a report in space" data-caption="Screen capture from HL2 device of a report in space" src="https://freight.cargo.site/w/1000/i/f7dd191ec1361d8073223e336e79251779095b36b7b9538cfe7033bc8d172c06/HL2_Cover01.png" /> <img width="1920" height="1080" width_o="1920" height_o="1080" data-src="https://freight.cargo.site/t/original/i/31ed3967c5a1b190cef3dfe67c95d3eb10afd37af5dbb49b7a0ab976d4a398c4/HL2_Cover02.png" data-mid="113519294" border="0" alt="Screen capture from HL2 device of reports pinned to a location" data-caption="Screen capture from HL2 device of reports pinned to a location" src="https://freight.cargo.site/w/1000/i/31ed3967c5a1b190cef3dfe67c95d3eb10afd37af5dbb49b7a0ab976d4a398c4/HL2_Cover02.png" /> <img width="1920" height="1080" width_o="1920" height_o="1080" data-src="https://freight.cargo.site/t/original/i/9699b1f646406e3ab08e1787eb32b766daa712c3fa783ce9751fb524f250db24/HL2_Cover03.png" data-mid="113519295" border="0" alt="Visualization of the usage of the report in a work environment" data-caption="Visualization of the usage of the report in a work environment" src="https://freight.cargo.site/w/1000/i/9699b1f646406e3ab08e1787eb32b766daa712c3fa783ce9751fb524f250db24/HL2_Cover03.png" /> <img width="1920" height="1080" width_o="1920" height_o="1080" data-src="https://freight.cargo.site/t/original/i/f7dd191ec1361d8073223e336e79251779095b36b7b9538cfe7033bc8d172c06/HL2_Cover01.png" data-mid="113519293" border="0" src="https://freight.cargo.site/w/1000/i/f7dd191ec1361d8073223e336e79251779095b36b7b9538cfe7033bc8d172c06/HL2_Cover01.png" /> <img width="1920" height="1080" width_o="1920" height_o="1080" data-src="https://freight.cargo.site/t/original/i/31ed3967c5a1b190cef3dfe67c95d3eb10afd37af5dbb49b7a0ab976d4a398c4/HL2_Cover02.png" data-mid="113519294" border="0" src="https://freight.cargo.site/w/1000/i/31ed3967c5a1b190cef3dfe67c95d3eb10afd37af5dbb49b7a0ab976d4a398c4/HL2_Cover02.png" /> <img width="1920" height="1080" width_o="1920" height_o="1080" data-src="https://freight.cargo.site/t/original/i/9699b1f646406e3ab08e1787eb32b766daa712c3fa783ce9751fb524f250db24/HL2_Cover03.png" data-mid="113519295" border="0" src="https://freight.cargo.site/w/1000/i/9699b1f646406e3ab08e1787eb32b766daa712c3fa783ce9751fb524f250db24/HL2_Cover03.png" /> The Power BI app for HoloLens 2 blends reports with the physical environment to create a 3D, immersive, hands-free experience where the user can move through the physical world and get relevant data when and where they need it. The app enables frontline workers to make insightful decisions hands-free, using data available to them on demand.&nbsp; Goals Provide users with real-time business information in the context of their work through a unique, delightful, immersive experience. Push the boundaries of the current work environment tools and create a new reality for the end user to interact with technology in order to achieve set goals. Demo flow of the Power BI Hololens II app, aken from the HL II device. Viewing reports from the toolbelt, navigating between pages and exploring pinned reports in space. ChallengesOvercome ‘Unity’ (Hololens development platform) limited set of patterns and visualizations to create a fluid, pleasant and innovative experience. <img width="1920" height="1080" width_o="1920" height_o="1080" data-src="https://freight.cargo.site/t/original/i/a3a3cc05e278ebd6ff3cbee0ec23c4cc9042e51885e06ff9b8030862ee204966/HL2_Detail.png" data-mid="113587932" border="0" alt="Detail from revised interface language" data-caption="Detail from revised interface language" src="https://freight.cargo.site/w/1000/i/a3a3cc05e278ebd6ff3cbee0ec23c4cc9042e51885e06ff9b8030862ee204966/HL2_Detail.png" /> New experiences A tool-belt for all the reports from which the user can choose items and place them around&nbsp; in space side-by-side. Navigation between report pages through the page index on the side of the report. Persisted location of the reports in space utilizing HoloLens 2’s anchoring system. The user can revisit the same place later and find items in the same place. <img width="600" height="338" width_o="600" height_o="338" data-src="https://freight.cargo.site/t/original/i/d0e65f6ba87e3c34fe175fd99ec8998284a0b046b21f79223866fa2e878c527c/HL2_01_02.gif" data-mid="113585677" border="0" alt="A toolbet from which to choose a report" data-caption="A toolbet from which to choose a report" src="https://freight.cargo.site/w/600/i/d0e65f6ba87e3c34fe175fd99ec8998284a0b046b21f79223866fa2e878c527c/HL2_01_02.gif" /> <img width="600" height="338" width_o="600" height_o="338" data-src="https://freight.cargo.site/t/original/i/a66cccdc92dd5cf057750206a2ad9f75112c0b69a9095330f2b93b4e6e3ada38/HL2_04.gif" data-mid="113585788" border="0" alt="Side page index to navigate between report page" data-caption="Side page index to navigate between report page" src="https://freight.cargo.site/w/600/i/a66cccdc92dd5cf057750206a2ad9f75112c0b69a9095330f2b93b4e6e3ada38/HL2_04.gif" /> <img width="600" height="338" width_o="600" height_o="338" data-src="https://freight.cargo.site/t/original/i/0b9d6702d2764e6e27310f0a1e71d868c44b48a851a0b7c36275a641ce3de192/HL2_05.gif" data-mid="113585862" border="0" alt="Persisted location for pinned reports" data-caption="Persisted location for pinned reports" src="https://freight.cargo.site/w/600/i/0b9d6702d2764e6e27310f0a1e71d868c44b48a851a0b7c36275a641ce3de192/HL2_05.gif" /> ︎ HoloLens II Welcome 3D welcome sequence infused in the physical environment [Role] Creative director, collaboration with Arik Ninio Power BI, AR design, 2020 <img width="2880" height="1410" width_o="2880" height_o="1410" data-src="https://freight.cargo.site/t/original/i/23c45abd1646a73d08c69005b73b9e1884ea5c8906c48c1b1c5adced211580c2/HL2Welcome_cover01.png" data-mid="113673803" border="0" alt="3D render of the concept for the welcomw experience sequence" data-caption="3D render of the concept for the welcomw experience sequence" src="https://freight.cargo.site/w/1000/i/23c45abd1646a73d08c69005b73b9e1884ea5c8906c48c1b1c5adced211580c2/HL2Welcome_cover01.png" /> The Power BI welcome experience for HoloLens 2 infuses the user’s surroundings with animated visualizations and reports and blends them with the physical environment to create a 3D&nbsp; immersive experience and open the mind to the possibilities ahead. &nbsp; Goals Entice the users and immerse them in an Augmented Reality experience while loading their personal data at the background. Set the ground for the experience to come and build anticipation. ︎ Challenges and opportunities Creating a WOW effect while designing with limited technical styling tools. Leveraging mixed reality color, perimeter, perspective and distance rules for user delight. 3D render sequence of the Welcome experience for Power BI Hololens II app 3D live sequence of the Welcome experience for Power BI Hololens II app, takn from the HL II device. https://ziganna.me/Ready-Set-Pet-1 Sat, 31 Jul 2021 08:58:34 +0000 Ziganna https://ziganna.me/Ready-Set-Pet-1 Ready Set Pet Pet adoption app that matches pets with their adopters [Role] Product designer, Concept creation Product definition, 2018 <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/2c1ee1bc23ef90dbd618fe39cafbb9fab678549474e151a365bac42e7837f4ad/ReadySetPet_cover.jpg" data-mid="118954656" border="0" alt="Ready Set Pet app, pet profile page." data-caption="Ready Set Pet app, pet profile page." src="https://freight.cargo.site/w/1000/i/2c1ee1bc23ef90dbd618fe39cafbb9fab678549474e151a365bac42e7837f4ad/ReadySetPet_cover.jpg" /> Pet adoption app that aims to find adopters the right fit by matching the pet to their lifestyle, in a fun-dating app like way. The use case was created as a self exercise project. Problem Statement Millions of animals are currently in shelters and foster homes awaiting adoption. There is a need in connecting people who are looking for a new pet with the right companion for them. In addition, an adopter requires guidance to find a pet which matches their lifestyle, considering factors such as breed, gender, age, temperament, and health status. <img width="4032" height="3024" width_o="4032" height_o="3024" data-src="https://freight.cargo.site/t/original/i/9ae410a0fa5dddfeb98c2dacd9e377d2cd5b45c43dafaeb5bd6fd709bd39561d/ReadySetPet_inner03.JPG" data-mid="115088016" border="0" alt="Street dog in a train station in Peru. Inspiration for the project. Taken on my trip in 2018." data-caption="Street dog in a train station in Peru. Inspiration for the project. Taken on my trip in 2018." src="https://freight.cargo.site/w/1000/i/9ae410a0fa5dddfeb98c2dacd9e377d2cd5b45c43dafaeb5bd6fd709bd39561d/ReadySetPet_inner03.JPG" /> <img width="4032" height="3024" width_o="4032" height_o="3024" data-src="https://freight.cargo.site/t/original/i/319630e55749f0d4ddb8990cd73807d20d73409fc0549fc91b272617079625ca/ReadySetPet_inner02.JPG" data-mid="115088015" border="0" alt="Street dogs pack in the streets of Peru, Cusco. Inspiration for the project. Taken on my trip in 2018." data-caption="Street dogs pack in the streets of Peru, Cusco. Inspiration for the project. Taken on my trip in 2018." src="https://freight.cargo.site/w/1000/i/319630e55749f0d4ddb8990cd73807d20d73409fc0549fc91b272617079625ca/ReadySetPet_inner02.JPG" /> Research First step was to understand the contextual sphere -&nbsp; The world of pet adoption. As a two time cat adopter, the adoption process is no stranger to me. This, with cross information from reading about adoption processes beyond Israel, brought me to the realization that the adoption process has broadly similar steps all across that may differ in some appearances. Furthermore, I’ve explored the product world of pet adoption and discovered variuos existing apps.(Adoption process resources:&nbsp;Wiki - general, Adoption guide by HomeoAnima, Adoption guide by Adopt a Pet Com and personal experience).Second step was to understand who is my persona.(Persona research resources: Adopters community, Commenters in an adoption community, Statistics on adopters, Adopters profiling and personal experience). <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/ff4999cd179c7287936164e5340a83e254f9377f4d180cc743d05fe4d13e32ec/ReadySetPet_inner04.png" data-mid="115091225" border="0" alt="Adoption process flow as concluded from the pet adoption research." data-caption="Adoption process flow as concluded from the pet adoption research." src="https://freight.cargo.site/w/1000/i/ff4999cd179c7287936164e5340a83e254f9377f4d180cc743d05fe4d13e32ec/ReadySetPet_inner04.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/0746a7dbcf61fed802eb2d8ccdc86297d7f3e28e8dcba7382a16bb93559d3b02/ReadySetPet_inner05.png" data-mid="115091226" border="0" alt="Apps in the realm of pet adoption that I found during the research." data-caption="Apps in the realm of pet adoption that I found during the research." src="https://freight.cargo.site/w/1000/i/0746a7dbcf61fed802eb2d8ccdc86297d7f3e28e8dcba7382a16bb93559d3b02/ReadySetPet_inner05.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/8d1729625625be0051f77c2cdee9f7a2c65a8ee0ea5a89e3b86b0171883d83f1/ReadySetPet_inner06.png" data-mid="115091227" border="0" alt="User profile and Persona profile for the Ready Set Pet app, based on user research." data-caption="User profile and Persona profile for the Ready Set Pet app, based on user research." src="https://freight.cargo.site/w/1000/i/8d1729625625be0051f77c2cdee9f7a2c65a8ee0ea5a89e3b86b0171883d83f1/ReadySetPet_inner06.png" /> Research Insights Product definition takeawaysMost adopter’s pet choices are driven by appearance, rather than lifestyle and personality compatability. The adoption process involves a fair amount of bureaucracy and stages, which is a potential pain point. Design takeawaysMany existing apps use the dating apps swiping experience, which is a sucessful model. The image is the center of the experience, this promotes appearance driven selection. Filters are based on options of appearance or physical traits, and the location is a describing parameter experience only.&nbsp;Persona takeaways People are willing to spend the time on someone else, meaning to invest energy in the matching process. People with various lifestyles require different pet personalities. ︎ Setting up GoalsFind the right fit for both sides -&nbsp;enable and guide the adopter to choose the most suitable pet for their lifestyle and not only by appearance preferences, to ensure adoption sucess rate.Excite about the adoption process -&nbsp;create an experience that will excite to act vs. the common action motivation in the adoption world which is empathy and pity.Motivate to follow all steps up until adoption -&nbsp;guide the adopter through the adoption process to prepare her/him for&nbsp;the actual steps, while maintaining the experience as simple and fluid as possible.&nbsp;︎ Definition Process The adoption mapping flow guided me in conceptualizing the foundations of the app flow and experience pillars. <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/58dd43e118750487071042b0db831a756d31ace6ff9cbffdcbcdb152e676ea52/ReadySetPet_inner07.png" data-mid="115147888" border="0" alt="App flow foundation, based on the adoption process mapping." data-caption="App flow foundation, based on the adoption process mapping." src="https://freight.cargo.site/w/1000/i/58dd43e118750487071042b0db831a756d31ace6ff9cbffdcbcdb152e676ea52/ReadySetPet_inner07.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/5d758e93320eea614b2d0d7ec8284f229bf95e83b8a97f12d522f65f4cde063f/ReadySetPet_inner08.png" data-mid="115147889" border="0" alt="Scoping of the flow for the app definition." data-caption="Scoping of the flow for the app definition." src="https://freight.cargo.site/w/1000/i/5d758e93320eea614b2d0d7ec8284f229bf95e83b8a97f12d522f65f4cde063f/ReadySetPet_inner08.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/b784cdf5ea312528b633fd5e515a26d02cb557c3c195cf88ce9cdfb68b00bd09/ReadySetPet_inner09.png" data-mid="115147890" border="0" alt="App flow foundation, based on the scoped adoption process mapping." data-caption="App flow foundation, based on the scoped adoption process mapping." src="https://freight.cargo.site/w/1000/i/b784cdf5ea312528b633fd5e515a26d02cb557c3c195cf88ce9cdfb68b00bd09/ReadySetPet_inner09.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/e06e16a09328e2eab348355587a718b2b1876ed76d30c00d07c1fbe50f8eee0a/ReadySetPet_inner10.png" data-mid="115147891" border="0" alt="Translation of the flow to experience elements." data-caption="Translation of the flow to experience elements." src="https://freight.cargo.site/w/1000/i/e06e16a09328e2eab348355587a718b2b1876ed76d30c00d07c1fbe50f8eee0a/ReadySetPet_inner10.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/55a7e9c44e8b13a84e4c61fb35ea5532f26d95dc8a7071b6cbb7a756b776046c/ReadySetPet_inner11.png" data-mid="115147892" border="0" alt="Layouting of the experience in the flow." data-caption="Layouting of the experience in the flow." src="https://freight.cargo.site/w/1000/i/55a7e9c44e8b13a84e4c61fb35ea5532f26d95dc8a7071b6cbb7a756b776046c/ReadySetPet_inner11.png" /> Leading factors in the experience were matching the right animal to the adopter (browse), simplifying the initial steps of the adoption process (questionnaire), and providing easy first contact with the shelter/foster while minimizing the preliminary pain points (questionnaire + first contact). <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/2750e299473d3239dbad850f4e88d999e99ac471d5058b8d9ea7981818367732/ReadySetPet_inner12.png" data-mid="115147893" border="0" alt="Pet representattion taken from existing apps, based on dating matching model." data-caption="Pet representattion taken from existing apps, based on dating matching model." src="https://freight.cargo.site/w/1000/i/2750e299473d3239dbad850f4e88d999e99ac471d5058b8d9ea7981818367732/ReadySetPet_inner12.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/480c164b33e8fbc46a93b20fa9ef78f536eab4ed031f38c04446df7d9b290652/ReadySetPet_inner13.png" data-mid="115147894" border="0" alt="Pet representattion that doesn&rsquo;t lean only on image, but also on traits and character matchability." data-caption="Pet representattion that doesn’t lean only on image, but also on traits and character matchability." src="https://freight.cargo.site/w/1000/i/480c164b33e8fbc46a93b20fa9ef78f536eab4ed031f38c04446df7d9b290652/ReadySetPet_inner13.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/8eca0be7ce411b44c8d156bb8e4df7cf342c2ac1e872bedc671a6dc7d92590ae/ReadySetPet_inner14.png" data-mid="115147895" border="0" alt="Perserve the swiping experience which is a successful interaction model." data-caption="Perserve the swiping experience which is a successful interaction model." src="https://freight.cargo.site/w/1000/i/8eca0be7ce411b44c8d156bb8e4df7cf342c2ac1e872bedc671a6dc7d92590ae/ReadySetPet_inner14.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/ecf0be297491c04d6bbadd873d797a01875f3e56ee9beeee0a8b51995df7db24/ReadySetPet_inner15.png" data-mid="115147896" border="0" alt="The questionnaire and the adoption prompts will follow the user throughout the entire experience as a top level experience." data-caption="The questionnaire and the adoption prompts will follow the user throughout the entire experience as a top level experience." src="https://freight.cargo.site/w/1000/i/ecf0be297491c04d6bbadd873d797a01875f3e56ee9beeee0a8b51995df7db24/ReadySetPet_inner15.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/a8dd725b939af58d3af07d0701056e39ba41f30d9adf3b10a00c3b35b2ccb83c/ReadySetPet_inner16.png" data-mid="119245191" border="0" alt="The questionnaire and the adoption prompts will follow the user throughout the entire experience as a top level experience." data-caption="The questionnaire and the adoption prompts will follow the user throughout the entire experience as a top level experience." src="https://freight.cargo.site/w/1000/i/a8dd725b939af58d3af07d0701056e39ba41f30d9adf3b10a00c3b35b2ccb83c/ReadySetPet_inner16.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/fa904c58e16452b1e5b6ba82e4c10cf3185d461de1851fd0fb385e77c87f7c38/ReadySetPet_inner17.png" data-mid="115147898" border="0" alt="Location based experience is a key strategy when wanting to make the entire adoption experience approachable. Thus, additional view was added." data-caption="Location based experience is a key strategy when wanting to make the entire adoption experience approachable. Thus, additional view was added." src="https://freight.cargo.site/w/1000/i/fa904c58e16452b1e5b6ba82e4c10cf3185d461de1851fd0fb385e77c87f7c38/ReadySetPet_inner17.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/ec5a24448652e649b06c958d7e3a3e1003bd71f3661666894bbcd1c2010fffe8/ReadySetPet_inner18.png" data-mid="115147899" border="0" alt="Gamification was one of the metapgore I used to make the process as a fun experience, the questionnaure was a great place to manifest it with the progress bar." data-caption="Gamification was one of the metapgore I used to make the process as a fun experience, the questionnaure was a great place to manifest it with the progress bar." src="https://freight.cargo.site/w/1000/i/ec5a24448652e649b06c958d7e3a3e1003bd71f3661666894bbcd1c2010fffe8/ReadySetPet_inner18.png" /> Flow and InteractionOnce the high level flow and experience pillars were defined, I layouted the specific interactions and the navigation. (Click here to see the entire flow and pages of the app) <img width="5000" height="1956" width_o="5000" height_o="1956" data-src="https://freight.cargo.site/t/original/i/d4da329b28307d2f4b067aa72b11caffff199963dae4a8c01b46d7379f9a07bb/ReadySetPet_inner19.png" data-mid="116921497" border="0" src="https://freight.cargo.site/w/1000/i/d4da329b28307d2f4b067aa72b11caffff199963dae4a8c01b46d7379f9a07bb/ReadySetPet_inner19.png" /> <img width="5000" height="1956" width_o="5000" height_o="1956" data-src="https://freight.cargo.site/t/original/i/0540a9a57a26be8a1e2e2d84a26841d1ed1d44a6df56809e92e24793242d818d/ReadySetPet_inner20_2.png" data-mid="115154050" border="0" src="https://freight.cargo.site/w/1000/i/0540a9a57a26be8a1e2e2d84a26841d1ed1d44a6df56809e92e24793242d818d/ReadySetPet_inner20_2.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/6b312ae68e5689c3e3ab60ac04e934750bc9f36dcedaacb0fbf7867307417c9d/001.png" data-mid="115210588" border="0" alt="Sign in screen." data-caption="Sign in screen." src="https://freight.cargo.site/w/1000/i/6b312ae68e5689c3e3ab60ac04e934750bc9f36dcedaacb0fbf7867307417c9d/001.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/543e80d9b95e5e3432df830ccb8d35d97198a6bc285ff233bd156fe4c975f811/002.png" data-mid="115210589" border="0" alt="Pets screen, nearby pets." data-caption="Pets screen, nearby pets." src="https://freight.cargo.site/w/1000/i/543e80d9b95e5e3432df830ccb8d35d97198a6bc285ff233bd156fe4c975f811/002.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/2e60a38ba8b78e27721a576782a6615a8d3f8f560ff7095bb848acdc53cc6435/003.png" data-mid="115210590" border="0" alt="Questionnaire about pets preferences,01." data-caption="Questionnaire about pets preferences,01." src="https://freight.cargo.site/w/1000/i/2e60a38ba8b78e27721a576782a6615a8d3f8f560ff7095bb848acdc53cc6435/003.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/4357d378b3c68ddb7d98ba7074093d727916a914c7eb14d689b82dac4a1412ee/004.png" data-mid="115210591" border="0" alt="Questionnaire about pets preferences,02." data-caption="Questionnaire about pets preferences,02." src="https://freight.cargo.site/w/1000/i/4357d378b3c68ddb7d98ba7074093d727916a914c7eb14d689b82dac4a1412ee/004.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/472e42fcd852ac5bbf085ba303880af9ab04a39d4be9c1fcbaaf5907e9ec11c7/005.png" data-mid="115210592" border="0" alt="Questionnaire about pets preferences,03." data-caption="Questionnaire about pets preferences,03." src="https://freight.cargo.site/w/1000/i/472e42fcd852ac5bbf085ba303880af9ab04a39d4be9c1fcbaaf5907e9ec11c7/005.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/6b1a490cdff2b2f69e82ca23037f455ed7718a4294dd64fe5a3bc73026fa2589/006.png" data-mid="115210593" border="0" alt="Tapping the top switcher, switches the view from cards to map." data-caption="Tapping the top switcher, switches the view from cards to map." src="https://freight.cargo.site/w/1000/i/6b1a490cdff2b2f69e82ca23037f455ed7718a4294dd64fe5a3bc73026fa2589/006.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/c127ef76f6ceda478ff9465ea3ef03f087250b8c26d0b5bbd667fca8bbcce652/007.png" data-mid="115210594" border="0" alt="Map view of nearby pets." data-caption="Map view of nearby pets." src="https://freight.cargo.site/w/1000/i/c127ef76f6ceda478ff9465ea3ef03f087250b8c26d0b5bbd667fca8bbcce652/007.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/fd8170ef75bdd05b94883d5f957b91cb2aae064afaf8584147743f4a8a6f9b94/008.png" data-mid="115210595" border="0" alt="Map view of nearby pets, with nearby adoption events." data-caption="Map view of nearby pets, with nearby adoption events." src="https://freight.cargo.site/w/1000/i/fd8170ef75bdd05b94883d5f957b91cb2aae064afaf8584147743f4a8a6f9b94/008.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/7a5f45f23e4616984b6d0b96c55579a760b250911afa92230c2d10c29eb5bb6b/009.png" data-mid="115210596" border="0" alt="Tapping the pet picture below, opens the pet's card." data-caption="Tapping the pet picture below, opens the pet's card." src="https://freight.cargo.site/w/1000/i/7a5f45f23e4616984b6d0b96c55579a760b250911afa92230c2d10c29eb5bb6b/009.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/efcfe2913bb81652c1c87c4215fa4b1526da3788529adc38d6e2d74d8d208933/010.png" data-mid="115210598" border="0" alt="Hovering the event on the map, shows the event details." data-caption="Hovering the event on the map, shows the event details." src="https://freight.cargo.site/w/1000/i/efcfe2913bb81652c1c87c4215fa4b1526da3788529adc38d6e2d74d8d208933/010.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/ef51b6a3eedd43f3a24ccf3d0dce85a8c4df27dde6e20cc54d29a4541c21f552/011.png" data-mid="115210599" border="0" alt="Pets screen, nearby pets. tap on the filter pane." data-caption="Pets screen, nearby pets. tap on the filter pane." src="https://freight.cargo.site/w/1000/i/ef51b6a3eedd43f3a24ccf3d0dce85a8c4df27dde6e20cc54d29a4541c21f552/011.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/2c11d1cd52e6c2534522984c5fa74b2db576513902336677fe92c4b3d1624336/012.png" data-mid="115210600" border="0" alt="Filter pane, 01." data-caption="Filter pane, 01." src="https://freight.cargo.site/w/1000/i/2c11d1cd52e6c2534522984c5fa74b2db576513902336677fe92c4b3d1624336/012.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/c6e42a1c567eb57d607fe2ea60065c4684652c8e7cd0e890125263e5985fe4e7/013.png" data-mid="115210602" border="0" alt="Filter pane, 02." data-caption="Filter pane, 02." src="https://freight.cargo.site/w/1000/i/c6e42a1c567eb57d607fe2ea60065c4684652c8e7cd0e890125263e5985fe4e7/013.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/6808c9fda6000cf30e6717e402f79b59f45a0ebba49d73bbb5766be99dde1dd6/014.png" data-mid="115210603" border="0" alt="Filter pane, 03." data-caption="Filter pane, 03." src="https://freight.cargo.site/w/1000/i/6808c9fda6000cf30e6717e402f79b59f45a0ebba49d73bbb5766be99dde1dd6/014.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/ae3eaecb1f8299e0180df362603f597d4fe479058b10edc4002f27a9a3b5332c/015.png" data-mid="115210605" border="0" alt="Filter pane, 04." data-caption="Filter pane, 04." src="https://freight.cargo.site/w/1000/i/ae3eaecb1f8299e0180df362603f597d4fe479058b10edc4002f27a9a3b5332c/015.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/b5882e6dda9ef735a1fc55606fb417da38cf18a05132634e86d8c9baa0f6b2c7/016.png" data-mid="115210608" border="0" alt="Filter pane, 05." data-caption="Filter pane, 05." src="https://freight.cargo.site/w/1000/i/b5882e6dda9ef735a1fc55606fb417da38cf18a05132634e86d8c9baa0f6b2c7/016.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/b3ff9e5ab50ac6b8b6afdc53312c502f0959c6df7454a43e4823b110ab046cb0/017.png" data-mid="115210609" border="0" alt="Filter pane, 06." data-caption="Filter pane, 06." src="https://freight.cargo.site/w/1000/i/b3ff9e5ab50ac6b8b6afdc53312c502f0959c6df7454a43e4823b110ab046cb0/017.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/586c3d30400c0f4fb1884c57e06e4c49bba8d3a7ce22bd97e8dfdd2420704b43/018.png" data-mid="115210615" border="0" alt="Pets screen, nearby pets. Expand pet card, 01." data-caption="Pets screen, nearby pets. Expand pet card, 01." src="https://freight.cargo.site/w/1000/i/586c3d30400c0f4fb1884c57e06e4c49bba8d3a7ce22bd97e8dfdd2420704b43/018.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/19d69bb8b4fe975a6a19b37d2dc120ab188bade37dc753b84ea14850a689fd08/019.png" data-mid="115210621" border="0" alt="Pets screen, nearby pets. Expand pet card, 02." data-caption="Pets screen, nearby pets. Expand pet card, 02." src="https://freight.cargo.site/w/1000/i/19d69bb8b4fe975a6a19b37d2dc120ab188bade37dc753b84ea14850a689fd08/019.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/d76b7ba66540ac173bfc8736a04871330a5e553cdc1efee97159b69cb4e925dc/020.png" data-mid="115210631" border="0" alt="Pets screen, nearby pets. Swipe pet card to favorite." data-caption="Pets screen, nearby pets. Swipe pet card to favorite." src="https://freight.cargo.site/w/1000/i/d76b7ba66540ac173bfc8736a04871330a5e553cdc1efee97159b69cb4e925dc/020.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/716784bcfbda52630f32665e4b5890998807362c2d21cefb5f979c1824b1e0b3/021.png" data-mid="115210639" border="0" alt="Notification if the new added card to the Favorite page." data-caption="Notification if the new added card to the Favorite page." src="https://freight.cargo.site/w/1000/i/716784bcfbda52630f32665e4b5890998807362c2d21cefb5f979c1824b1e0b3/021.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/b654b4d8e2b9a079a18ad18262caadbc6af7e5b6d693aabe9e331c16e37a8809/022.png" data-mid="115210647" border="0" alt="Favorite pets page." data-caption="Favorite pets page." src="https://freight.cargo.site/w/1000/i/b654b4d8e2b9a079a18ad18262caadbc6af7e5b6d693aabe9e331c16e37a8809/022.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/fe2d2116b2a07770fa8392996a6e9c989d76b6d6ad39ef6242b532b56af1b989/023.png" data-mid="115210650" border="0" alt="Pet profile page, 01." data-caption="Pet profile page, 01." src="https://freight.cargo.site/w/1000/i/fe2d2116b2a07770fa8392996a6e9c989d76b6d6ad39ef6242b532b56af1b989/023.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/a473e1cde4b7fc907a78e7d9844a932ff2022de05abf84b3af68994523755863/024.png" data-mid="115211390" border="0" alt="Pet profile page, 02." data-caption="Pet profile page, 02." src="https://freight.cargo.site/w/1000/i/a473e1cde4b7fc907a78e7d9844a932ff2022de05abf84b3af68994523755863/024.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/e62a7d2d130631c4e632666ea04e773fdfc8bc91c2bf482e762a68c94b470da4/025.png" data-mid="115211391" border="0" alt="Pet profile page, 03." data-caption="Pet profile page, 03." src="https://freight.cargo.site/w/1000/i/e62a7d2d130631c4e632666ea04e773fdfc8bc91c2bf482e762a68c94b470da4/025.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/adb1dcd09724d5952feb4f5d547f0c67ccc4d162389f2a082bca08c6ec126326/026.png" data-mid="115210668" border="0" alt="Pet profile page, 04." data-caption="Pet profile page, 04." src="https://freight.cargo.site/w/1000/i/adb1dcd09724d5952feb4f5d547f0c67ccc4d162389f2a082bca08c6ec126326/026.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/f0e8cd2f3a5ee2b741362d745a8195a651a60490328fd442c3dcb12938987b79/027.png" data-mid="115210673" border="0" alt="Pet profile page, 05." data-caption="Pet profile page, 05." src="https://freight.cargo.site/w/1000/i/f0e8cd2f3a5ee2b741362d745a8195a651a60490328fd442c3dcb12938987b79/027.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/58288ccb2cbdfee5f6f634dc2e664d4df034d6ee1f5082128d20d38be8cf84d3/028.png" data-mid="115210676" border="0" alt="Pet profile page, 06." data-caption="Pet profile page, 06." src="https://freight.cargo.site/w/1000/i/58288ccb2cbdfee5f6f634dc2e664d4df034d6ee1f5082128d20d38be8cf84d3/028.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/49b3dceddcc9fad4c5bb6bbe386602c7f4f3729881a0e5a7017bd2fdb123fe41/029.png" data-mid="115210682" border="0" alt="Shelters page." data-caption="Shelters page." src="https://freight.cargo.site/w/1000/i/49b3dceddcc9fad4c5bb6bbe386602c7f4f3729881a0e5a7017bd2fdb123fe41/029.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/0c158355962bd4434c3f785a94d14d81ca226d8d65388fabfcb0e86a372913e9/030.png" data-mid="115210691" border="0" alt="Shelters page. Expanded shelter card with details." data-caption="Shelters page. Expanded shelter card with details." src="https://freight.cargo.site/w/1000/i/0c158355962bd4434c3f785a94d14d81ca226d8d65388fabfcb0e86a372913e9/030.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/b130021c9b6f41827e74c411fd5729d36e2c65c0cc0fb7c127304da734f90fcd/031.png" data-mid="115210695" border="0" alt="Adoption events page." data-caption="Adoption events page." src="https://freight.cargo.site/w/1000/i/b130021c9b6f41827e74c411fd5729d36e2c65c0cc0fb7c127304da734f90fcd/031.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/9818250d59b762dc412cc7a7e9457ca4300b6581852b97afa5efb96009be1511/032.png" data-mid="115210701" border="0" alt="Adoption events page. Expanded event card with details." data-caption="Adoption events page. Expanded event card with details." src="https://freight.cargo.site/w/1000/i/9818250d59b762dc412cc7a7e9457ca4300b6581852b97afa5efb96009be1511/032.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/e6a25f9db43252041071d35bb2f829f71129aa89a7255afad2c75d175fadd2c4/033.png" data-mid="115210712" border="0" alt="Swiping right to add event to the calendar." data-caption="Swiping right to add event to the calendar." src="https://freight.cargo.site/w/1000/i/e6a25f9db43252041071d35bb2f829f71129aa89a7255afad2c75d175fadd2c4/033.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/3761f522f80452248bd8d9bc80c82c4d049cd605aae159f047bd769e0e311eed/034.png" data-mid="115210714" border="0" alt="Pets screen, nearby pets. Tapping the &quot;Tips&quot; section." data-caption="Pets screen, nearby pets. Tapping the &quot;Tips&quot; section." src="https://freight.cargo.site/w/1000/i/3761f522f80452248bd8d9bc80c82c4d049cd605aae159f047bd769e0e311eed/034.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/d94589b9eb55f50c706d6988126a30a57f819766b8f64888446d4270a46c4666/035.png" data-mid="115210754" border="0" alt="Helpful tips on pet selection and adoption process, 01." data-caption="Helpful tips on pet selection and adoption process, 01." src="https://freight.cargo.site/w/1000/i/d94589b9eb55f50c706d6988126a30a57f819766b8f64888446d4270a46c4666/035.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/025fbcc640e15aa63b9c5f1d969d5bd975db15e4f52775dfbea7891576358592/036.png" data-mid="115210760" border="0" alt="Helpful tips on pet selection and adoption process, 02." data-caption="Helpful tips on pet selection and adoption process, 02." src="https://freight.cargo.site/w/1000/i/025fbcc640e15aa63b9c5f1d969d5bd975db15e4f52775dfbea7891576358592/036.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/abb3702df3cc18a1faf855ed1efce01d329883f16416795952ea566031e7d595/037.png" data-mid="115210769" border="0" alt="Helpful tips on pet selection and adoption process, 03." data-caption="Helpful tips on pet selection and adoption process, 03." src="https://freight.cargo.site/w/1000/i/abb3702df3cc18a1faf855ed1efce01d329883f16416795952ea566031e7d595/037.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/e78d9fe1fd67bc36ef762c26e62e04e0311c03be9c5e68e053f232a3c45219dc/038.png" data-mid="115210773" border="0" alt="Pets screen, nearby pets. Tapping the iser picture." data-caption="Pets screen, nearby pets. Tapping the iser picture." src="https://freight.cargo.site/w/1000/i/e78d9fe1fd67bc36ef762c26e62e04e0311c03be9c5e68e053f232a3c45219dc/038.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/9fe0bfe1eea5bcfa894c5d3122bbbc271d3cec56adff63d2086c1ba6a04ff2d7/039.png" data-mid="115210782" border="0" alt="Settings page." data-caption="Settings page." src="https://freight.cargo.site/w/1000/i/9fe0bfe1eea5bcfa894c5d3122bbbc271d3cec56adff63d2086c1ba6a04ff2d7/039.png" /> Visual Design The animal adoption world is usually full of sad stories and low quality pictures of animals in captivity or in poor condition. For the visual experience I wanted the app to be visualy attractive, light and fun so that users would want to explore further and stick around. Motivate from a positive place of happiness instead of pity. My insparations were computer games and the Nyan cat. <img width="3840" height="2060" width_o="3840" height_o="2060" data-src="https://freight.cargo.site/t/original/i/8ec1268ff75eebb9d7fe478b5378111dcb3843233f0ecc2dd96856b1804c9390/ReadySetPet_inner22.png" data-mid="115149141" border="0" src="https://freight.cargo.site/w/1000/i/8ec1268ff75eebb9d7fe478b5378111dcb3843233f0ecc2dd96856b1804c9390/ReadySetPet_inner22.png" /> Click here for a deeper dive to the definition process thinking.(Beware of the overly descriptive content, but prepare yourself for wider understanding :) Click here for an analysis of the design and experience consolidation. https://ziganna.me/Goals Fri, 02 Jul 2021 11:33:00 +0000 Ziganna https://ziganna.me/Goals Goals A platform to manage and track business goals [Role] Lead product designer, Experience definition Power BI, App design, 2020 <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/fbb4cf86e981770ef2e1f717bb73ab02de3162168ed4433a1625ff0dd8f90952/Goals_inner06.jpg" data-mid="118518247" border="0" alt="Left to right: Goals Hub, Goal details panel, Scorecard (collection of goals), dark mode." data-caption="Left to right: Goals Hub, Goal details panel, Scorecard (collection of goals), dark mode." src="https://freight.cargo.site/w/1000/i/fbb4cf86e981770ef2e1f717bb73ab02de3162168ed4433a1625ff0dd8f90952/Goals_inner06.jpg" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/c5c74eb18523d02a531c7c8287f7e4d8da6ad8a5a713b5fb62d12691e2a2e0e6/Goals_inner01.jpg" data-mid="118933983" border="0" alt="Left to right: Goals Hub, Goal details panel, Scorecard (collection of goals), light mode." data-caption="Left to right: Goals Hub, Goal details panel, Scorecard (collection of goals), light mode." src="https://freight.cargo.site/w/1000/i/c5c74eb18523d02a531c7c8287f7e4d8da6ad8a5a713b5fb62d12691e2a2e0e6/Goals_inner01.jpg" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/48787db0c8b885329a63cd7f59d9e4b5dd06630040d5e06ad062dda130e9610b/Goals_inner02.jpg" data-mid="118934275" border="0" alt="Left to right: Goals Hub, Scorecard, landscape." data-caption="Left to right: Goals Hub, Scorecard, landscape." src="https://freight.cargo.site/w/1000/i/48787db0c8b885329a63cd7f59d9e4b5dd06630040d5e06ad062dda130e9610b/Goals_inner02.jpg" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/563d119f1f4e6ae3581a11413e88f63cb5cc0d09d56cf37f7e237e5fef3277f9/Goals_inner03.jpg" data-mid="118934276" border="0" alt="Left to right: Goals Hub, Scorecard (assembly of goals), tablet portrait." data-caption="Left to right: Goals Hub, Scorecard (assembly of goals), tablet portrait." src="https://freight.cargo.site/w/1000/i/563d119f1f4e6ae3581a11413e88f63cb5cc0d09d56cf37f7e237e5fef3277f9/Goals_inner03.jpg" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/4ce2ef76249931fb515b323714167d508210afd4da6731a745f7f8bc6e45d36f/Goals_inner04.jpg" data-mid="118934277" border="0" alt="Goal Hub, tablet landscape." data-caption="Goal Hub, tablet landscape." src="https://freight.cargo.site/w/1000/i/4ce2ef76249931fb515b323714167d508210afd4da6731a745f7f8bc6e45d36f/Goals_inner04.jpg" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/8ada20aea481140608f9de3eba645232a24d76ccd2d0e3322f9555fecdc43639/Goals_inner05.jpg" data-mid="118934278" border="0" alt="Scorecard (collection of goals), tablet landscape." data-caption="Scorecard (collection of goals), tablet landscape." src="https://freight.cargo.site/w/1000/i/8ada20aea481140608f9de3eba645232a24d76ccd2d0e3322f9555fecdc43639/Goals_inner05.jpg" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/fbb4cf86e981770ef2e1f717bb73ab02de3162168ed4433a1625ff0dd8f90952/Goals_inner06.jpg" data-mid="118518247" border="0" src="https://freight.cargo.site/w/1000/i/fbb4cf86e981770ef2e1f717bb73ab02de3162168ed4433a1625ff0dd8f90952/Goals_inner06.jpg" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/c5c74eb18523d02a531c7c8287f7e4d8da6ad8a5a713b5fb62d12691e2a2e0e6/Goals_inner01.jpg" data-mid="118933983" border="0" src="https://freight.cargo.site/w/1000/i/c5c74eb18523d02a531c7c8287f7e4d8da6ad8a5a713b5fb62d12691e2a2e0e6/Goals_inner01.jpg" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/48787db0c8b885329a63cd7f59d9e4b5dd06630040d5e06ad062dda130e9610b/Goals_inner02.jpg" data-mid="118934275" border="0" src="https://freight.cargo.site/w/1000/i/48787db0c8b885329a63cd7f59d9e4b5dd06630040d5e06ad062dda130e9610b/Goals_inner02.jpg" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/563d119f1f4e6ae3581a11413e88f63cb5cc0d09d56cf37f7e237e5fef3277f9/Goals_inner03.jpg" data-mid="118934276" border="0" src="https://freight.cargo.site/w/1000/i/563d119f1f4e6ae3581a11413e88f63cb5cc0d09d56cf37f7e237e5fef3277f9/Goals_inner03.jpg" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/4ce2ef76249931fb515b323714167d508210afd4da6731a745f7f8bc6e45d36f/Goals_inner04.jpg" data-mid="118934277" border="0" src="https://freight.cargo.site/w/1000/i/4ce2ef76249931fb515b323714167d508210afd4da6731a745f7f8bc6e45d36f/Goals_inner04.jpg" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/8ada20aea481140608f9de3eba645232a24d76ccd2d0e3322f9555fecdc43639/Goals_inner05.jpg" data-mid="118934278" border="0" src="https://freight.cargo.site/w/1000/i/8ada20aea481140608f9de3eba645232a24d76ccd2d0e3322f9555fecdc43639/Goals_inner05.jpg" /> ׳Goals׳ is a platform for business goals tracking and managing within Power BI. The feature included the creation ofA new area in the Home page, ׳Goals Hub׳ with individual goals for specific tracking, detailed view of their progress and an update abilityA new data item, ׳Scorecard׳, that displays connected goals in one view. “Goals” Power BI Mobile, demo flow of a goal ‘quick check-in’, detail view of the progress and navigation to the relevant ‘scorecard’. Motivation Customers are using Power BI as their centralized analytics data platform. Goal tracking sits on top of their organizational data and is a part of their analytics solutions. Customer surveys and interviews indicated that 85% of them already leverage Power BI for tracking goals &amp; outcomes, with their own built workarounds. The workarounds require to consolidate all their important KPIs into a single view, and are not very easy for users. They would like this to be handled by Power BI as an offering. <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/9bf78eb971729ad19bee0c49bd8088a672693804e5952ca76349619240d05ef0/Goals_motivation01.png" data-mid="118875518" border="0" alt="Survey results of a background study on power BI customers existing 'Goals' usage." data-caption="Survey results of a background study on power BI customers existing 'Goals' usage." src="https://freight.cargo.site/w/1000/i/9bf78eb971729ad19bee0c49bd8088a672693804e5952ca76349619240d05ef0/Goals_motivation01.png" /> VisionThe aspiration was to enhance the data culture in the organization by providing a visibility to various business metrics. Increase loyalty, engagement and retention by providing a tool to manage business-related metrics and supporting data. ︎ ChallengesCreating a fluid, intuitive experience while presenting the user a potential data overload. Translating big screen layouts (of Power BI in the desktop), flows and design mental models to the small screen with responsive behavior in mind to accommodate both mobile and tablet. These were in mind when creating the׳Goal׳ card, ׳Scorecard׳ and ׳Goals Hub׳ experiences. Goal card The goal card is the basic unit of the business metric. The card provides the user the essential information about the goal. It presents the goal name, current and target value, status, progress trend, owner and due date. The goal card is consumed across various platforms and devices, and as such was designed to be responsive. <img width="2512" height="1000" width_o="2512" height_o="1000" data-src="https://freight.cargo.site/t/original/i/153fa2836f52322994d5a8c78b36012f361405efd65e50ab77f54de259d10eec/Goals_Scorecardstructuremobile00.png" data-mid="118891214" border="0" alt="Goal card for mobile portrait." data-caption="Goal card for mobile portrait." src="https://freight.cargo.site/w/1000/i/153fa2836f52322994d5a8c78b36012f361405efd65e50ab77f54de259d10eec/Goals_Scorecardstructuremobile00.png" /> <img width="2512" height="1000" width_o="2512" height_o="1000" data-src="https://freight.cargo.site/t/original/i/ba1a343aa36b0914a79a085731998a233d66aa1e8d8c8fb2d98d49b3194cb5dc/Goals_Scorecardstructurelandscape00.png" data-mid="118891209" border="0" alt="Goal card for mobile landscape and tablet portrait." data-caption="Goal card for mobile landscape and tablet portrait." src="https://freight.cargo.site/w/1000/i/ba1a343aa36b0914a79a085731998a233d66aa1e8d8c8fb2d98d49b3194cb5dc/Goals_Scorecardstructurelandscape00.png" /> <img width="2512" height="1000" width_o="2512" height_o="1000" data-src="https://freight.cargo.site/t/original/i/d1b8eb8a694d85c77cc1e23f76d3a2c304d189beecf90e30363ba15f790320c1/Goals_Scorecardstructuretablet00.png" data-mid="118891216" border="0" alt="Goal card for tablet landscape." data-caption="Goal card for tablet landscape." src="https://freight.cargo.site/w/1000/i/d1b8eb8a694d85c77cc1e23f76d3a2c304d189beecf90e30363ba15f790320c1/Goals_Scorecardstructuretablet00.png" /> <img width="1000" height="302" width_o="1000" height_o="302" data-src="https://freight.cargo.site/t/original/i/598171ddff357a3cafef916f3024858935b1e6437056e21e525304e7a792758e/GoalStructureResponsive01.gif" data-mid="118892787" border="0" alt="Goal card responsive layout across various device platforms, structure." data-caption="Goal card responsive layout across various device platforms, structure." src="https://freight.cargo.site/w/1000/i/598171ddff357a3cafef916f3024858935b1e6437056e21e525304e7a792758e/GoalStructureResponsive01.gif" /> <img width="1000" height="302" width_o="1000" height_o="302" data-src="https://freight.cargo.site/t/original/i/be867bff3b0cb5bf7e9685f23a640c3b50773f2b5a7ce96c3f4056d8721e41c2/GoalStructureResponsive02.gif" data-mid="118892790" border="0" alt="Goal card responsive layout across various device platforms, design." data-caption="Goal card responsive layout across various device platforms, design." src="https://freight.cargo.site/w/1000/i/be867bff3b0cb5bf7e9685f23a640c3b50773f2b5a7ce96c3f4056d8721e41c2/GoalStructureResponsive02.gif" /> Scorecard The ׳Scorecard׳ is a collections of goals and/or subgoals. The goals in the scorecard are themed around the same ׳umbrella׳ business goal, and/or assigned to the same team members. The scorecards provides the consumer an easy one point view of the goals progress in a specific business area or team. The scorecard is consumed across devices and platforms and was built with responsiveness in mind, as the goal card. <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/b8304deb728ffd0b5e80f42f586fde02d6857e1fd03b1778c88abb2a691362fa/Goals_Scorecardstructuremobile03.png" data-mid="118895080" border="0" alt="Mobile portrait Scorecard." data-caption="Mobile portrait Scorecard." src="https://freight.cargo.site/w/1000/i/b8304deb728ffd0b5e80f42f586fde02d6857e1fd03b1778c88abb2a691362fa/Goals_Scorecardstructuremobile03.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/871794348c322a610925f232247c967e71839e9478ef4099359ed40956da3dd3/Goals_Scorecardstructurelandscape03.png" data-mid="118895078" border="0" alt="Mobile landscape Scorecard." data-caption="Mobile landscape Scorecard." src="https://freight.cargo.site/w/1000/i/871794348c322a610925f232247c967e71839e9478ef4099359ed40956da3dd3/Goals_Scorecardstructurelandscape03.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/4c1d676b5495ba39aad256b23ceae1e9a8ac414cea5f761ec64a116dda29485e/Goals_Scorecardstructurelandscape04_2.png" data-mid="118895296" border="0" alt="Tablet portrait Scorecard." data-caption="Tablet portrait Scorecard." src="https://freight.cargo.site/w/1000/i/4c1d676b5495ba39aad256b23ceae1e9a8ac414cea5f761ec64a116dda29485e/Goals_Scorecardstructurelandscape04_2.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/2f70f9b1ca9dae9778981228e75a7ef89f35f2b7dd2a1d8d975f1df1b6fb85db/Goals_Scorecardstructuretablet03.png" data-mid="118895081" border="0" alt="Tablet landscape Scorecard." data-caption="Tablet landscape Scorecard." src="https://freight.cargo.site/w/1000/i/2f70f9b1ca9dae9778981228e75a7ef89f35f2b7dd2a1d8d975f1df1b6fb85db/Goals_Scorecardstructuretablet03.png" /> <img width="560" height="560" width_o="560" height_o="560" data-src="https://freight.cargo.site/t/original/i/2e5d128336e2c847379ab2892b922b5e9c49da074c2ca0714f493ae591df50dd/ScorecardMobile_Dark.gif" data-mid="118895530" border="0" alt="Mobile scorecard responsive behaviour in portrait and landscape." data-caption="Mobile scorecard responsive behaviour in portrait and landscape." src="https://freight.cargo.site/w/560/i/2e5d128336e2c847379ab2892b922b5e9c49da074c2ca0714f493ae591df50dd/ScorecardMobile_Dark.gif" /> Goals Hub The Goals Hub is a centralized place that makes it easy for the user to stay on top of hers/his important goals and to navigate to relevant scorecards.The top of the Goals hub displays the goals that are relevant to the user, and beneath the recently accessed, favorite and shared with the user scorecards. <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/36989bb3d73f7e85700ecc547a23f78dc81216b14b9a772c70cf4930a19870b6/Goals_structure06.png" data-mid="118903532" border="0" alt="Left: scorecard, right: Goals Hub." data-caption="Left: scorecard, right: Goals Hub." src="https://freight.cargo.site/w/1000/i/36989bb3d73f7e85700ecc547a23f78dc81216b14b9a772c70cf4930a19870b6/Goals_structure06.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/fb71c7093e971b7803a98782ceb8b73b4130d97d7935403db4e625ff2030f997/Goals_structure01.png" data-mid="118903083" border="0" alt="Goal basic unit." data-caption="Goal basic unit." src="https://freight.cargo.site/w/1000/i/fb71c7093e971b7803a98782ceb8b73b4130d97d7935403db4e625ff2030f997/Goals_structure01.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/95738244fd938c6c49dca22fc7db3b500f3567508c3d1b057fd19684cad43791/Goals_structure02.png" data-mid="118903085" border="0" alt="Goal with sub-goals." data-caption="Goal with sub-goals." src="https://freight.cargo.site/w/1000/i/95738244fd938c6c49dca22fc7db3b500f3567508c3d1b057fd19684cad43791/Goals_structure02.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/4934622dc9b3e103033fdc37c27cf153988faa88447a7ec42dcd29218211d56b/Goals_structure03.png" data-mid="118903087" border="0" alt="A scorecard." data-caption="A scorecard." src="https://freight.cargo.site/w/1000/i/4934622dc9b3e103033fdc37c27cf153988faa88447a7ec42dcd29218211d56b/Goals_structure03.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/fd9408405271326ba928e49252e370cce516366323a9c090b22a900aed328aff/Goals_structure04.png" data-mid="118903088" border="0" alt="Left: scorecard, right: Goals Hub with relevant goals to the user." data-caption="Left: scorecard, right: Goals Hub with relevant goals to the user." src="https://freight.cargo.site/w/1000/i/fd9408405271326ba928e49252e370cce516366323a9c090b22a900aed328aff/Goals_structure04.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/172fce48c6126269a3e94b758112363450278e570f15f2cec80d4d5e3503ec04/Goals_structure05.png" data-mid="118903090" border="0" alt="Left: scorecard, right: Goals Hub with relevant goals and scorecards." data-caption="Left: scorecard, right: Goals Hub with relevant goals and scorecards." src="https://freight.cargo.site/w/1000/i/172fce48c6126269a3e94b758112363450278e570f15f2cec80d4d5e3503ec04/Goals_structure05.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/f6b7f2037c6eb1537a1f9a6f170c6e4be1118b7847ec5dd61ae54917105a4dd8/Goals_structure02.gif" data-mid="118902743" border="0" alt="Scorecard and Goals Hub structure system." data-caption="Scorecard and Goals Hub structure system." src="https://freight.cargo.site/w/1000/i/f6b7f2037c6eb1537a1f9a6f170c6e4be1118b7847ec5dd61ae54917105a4dd8/Goals_structure02.gif" /> Quick goal value check-ins are available from the ׳Goals Hub׳ to accomodate the ׳on-the-go׳ scenario of the mobile user. <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/bf3c0319ccd03d1371b8f64755a9d34fbb5d3b87e7b7cf8f2022f07df43c0dc6/Goals_inner_quick01.png" data-mid="118899701" border="0" alt="User selects the action button in the Goal strip in Goals Hub." data-caption="User selects the action button in the Goal strip in Goals Hub." src="https://freight.cargo.site/w/1000/i/bf3c0319ccd03d1371b8f64755a9d34fbb5d3b87e7b7cf8f2022f07df43c0dc6/Goals_inner_quick01.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/5383290d07952845d39328a042c0462a7115a2a6d67fb89e0fb4f01861cc965d/Goals_inner_quick02.png" data-mid="118899702" border="0" alt="Goal action menu presents the available actions." data-caption="Goal action menu presents the available actions." src="https://freight.cargo.site/w/1000/i/5383290d07952845d39328a042c0462a7115a2a6d67fb89e0fb4f01861cc965d/Goals_inner_quick02.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/97d16c7028a52c17873d0e7702b0921c0426ac33765fd71f6876bfa7527e6a80/Goals_inner_quick03.png" data-mid="118899703" border="0" alt="&quot;Quick check-in&quot; action pops up the keyboard." data-caption="&quot;Quick check-in&quot; action pops up the keyboard." src="https://freight.cargo.site/w/1000/i/97d16c7028a52c17873d0e7702b0921c0426ac33765fd71f6876bfa7527e6a80/Goals_inner_quick03.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/b99442bdd38de37ff54394b018c5fc7b99ac4d7d99bcbb8d4d7bebe317a627b5/Goals_inner_quick04.png" data-mid="118899707" border="0" alt="User updates the goal value and status." data-caption="User updates the goal value and status." src="https://freight.cargo.site/w/1000/i/b99442bdd38de37ff54394b018c5fc7b99ac4d7d99bcbb8d4d7bebe317a627b5/Goals_inner_quick04.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/ab04550a09f8cafdd05a2c852c5a1e57627f11c93b1f79bd9b806a21bdda391d/Goals_inner_quick05.png" data-mid="118899711" border="0" alt="User confirms the check-in." data-caption="User confirms the check-in." src="https://freight.cargo.site/w/1000/i/ab04550a09f8cafdd05a2c852c5a1e57627f11c93b1f79bd9b806a21bdda391d/Goals_inner_quick05.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/bec996e2de000ee6556a186b8c122dfd44084e5575324b8c60eff66bc4e15401/Goals_inner_quick06.png" data-mid="118899716" border="0" alt="The new value and statys are updated in the Goals Hub." data-caption="The new value and statys are updated in the Goals Hub." src="https://freight.cargo.site/w/1000/i/bec996e2de000ee6556a186b8c122dfd44084e5575324b8c60eff66bc4e15401/Goals_inner_quick06.png" /> Easy access to goal details along with other actions were added to the goal card in the hub for users who want to have a deeper dive and undertand of the goal progress overtime. <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/998a735c90126f97a45cb4e2260e1ca45904af022f9000d7cb8b3b558f0190eb/Goals_inner_details01.png" data-mid="118898294" border="0" alt="User selects the action button in the Goal strip in Goals Hub." data-caption="User selects the action button in the Goal strip in Goals Hub." src="https://freight.cargo.site/w/1000/i/998a735c90126f97a45cb4e2260e1ca45904af022f9000d7cb8b3b558f0190eb/Goals_inner_details01.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/89efe791e357bd898e4b1ee37673f7851ccd517b6ccbe7d6dc71f6b0100b2fd8/Goals_inner_details02.png" data-mid="118898295" border="0" alt="Goal action menu presents the available actions." data-caption="Goal action menu presents the available actions." src="https://freight.cargo.site/w/1000/i/89efe791e357bd898e4b1ee37673f7851ccd517b6ccbe7d6dc71f6b0100b2fd8/Goals_inner_details02.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/3a01240ad55f1aec8062bbdf1bec9d3c7c2dabc24613d941f872885dc0a5530f/Goals_inner_details03.png" data-mid="118898296" border="0" alt="&quot;Details&quot; action pops up the goals details panel with goal values progress over time and goal activity beneath." data-caption="&quot;Details&quot; action pops up the goals details panel with goal values progress over time and goal activity beneath." src="https://freight.cargo.site/w/1000/i/3a01240ad55f1aec8062bbdf1bec9d3c7c2dabc24613d941f872885dc0a5530f/Goals_inner_details03.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/60ce92b4fa31adb3a0c1922f6fbb6fec8914b563592e080dd3e777ff17264e5f/Goals_inner_details04.png" data-mid="118898300" border="0" alt="Tapping one of the values on the chart, highlights the relevant activity to that value." data-caption="Tapping one of the values on the chart, highlights the relevant activity to that value." src="https://freight.cargo.site/w/1000/i/60ce92b4fa31adb3a0c1922f6fbb6fec8914b563592e080dd3e777ff17264e5f/Goals_inner_details04.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/3d4c696573dfd0cb66cab84b10c79d44db41d4e40aff9bea425740a3e5faf6e6/Goals_inner_details05.png" data-mid="118898304" border="0" alt="Swiping the activity reveals its available actions." data-caption="Swiping the activity reveals its available actions." src="https://freight.cargo.site/w/1000/i/3d4c696573dfd0cb66cab84b10c79d44db41d4e40aff9bea425740a3e5faf6e6/Goals_inner_details05.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/d7cd4d84c08f08cd45b3a2c9ddf5417a2b26c439da0703c7131c7779f8f4e8e4/Goals_inner_details06.png" data-mid="118898305" border="0" alt="&quot;Add note&quot; action pops up a keyboard to add a note to the check-in activity." data-caption="&quot;Add note&quot; action pops up a keyboard to add a note to the check-in activity." src="https://freight.cargo.site/w/1000/i/d7cd4d84c08f08cd45b3a2c9ddf5417a2b26c439da0703c7131c7779f8f4e8e4/Goals_inner_details06.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/3a9ba244397d7a07bae1fbf8c609cf8c43ad08a6004ebc1870022211840a714a/Goals_inner_details07.png" data-mid="118898306" border="0" alt="User confirms the note addition." data-caption="User confirms the note addition." src="https://freight.cargo.site/w/1000/i/3a9ba244397d7a07bae1fbf8c609cf8c43ad08a6004ebc1870022211840a714a/Goals_inner_details07.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/da778ec3e1efa1b3cf523132d78a6a30f05602e4abaf76540791e32a7211e48b/Goals_inner_details08.png" data-mid="118898307" border="0" alt="The &quot;Note&quot; tab a the top filters the activities to show only the ones with notes." data-caption="The &quot;Note&quot; tab a the top filters the activities to show only the ones with notes." src="https://freight.cargo.site/w/1000/i/da778ec3e1efa1b3cf523132d78a6a30f05602e4abaf76540791e32a7211e48b/Goals_inner_details08.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/ca1516cbde41ca1fcc46d32a90f92ccca7754768921fd5b2d77acc2d8f7916a4/Goals_inner_details09.png" data-mid="118898308" border="0" alt="Dragging the panel upwards shows more of the activities." data-caption="Dragging the panel upwards shows more of the activities." src="https://freight.cargo.site/w/1000/i/ca1516cbde41ca1fcc46d32a90f92ccca7754768921fd5b2d77acc2d8f7916a4/Goals_inner_details09.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/aff5a5ca1a712aad55ab727ba077a8b7594a852bf34ebc01753e13d660d07ae3/Goals_inner_details10.png" data-mid="118898309" border="0" alt="Tapping outside of the panel, exits the details pane back to the Goals Hub." data-caption="Tapping outside of the panel, exits the details pane back to the Goals Hub." src="https://freight.cargo.site/w/1000/i/aff5a5ca1a712aad55ab727ba077a8b7594a852bf34ebc01753e13d660d07ae3/Goals_inner_details10.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/928e9299181cc8104ef0baef08d848f3ce2e322a1f1ab949a60ed1ea37215d54/Goals_inner_details11.png" data-mid="118898310" border="0" alt="Goals Hub, mobile portrait." data-caption="Goals Hub, mobile portrait." src="https://freight.cargo.site/w/1000/i/928e9299181cc8104ef0baef08d848f3ce2e322a1f1ab949a60ed1ea37215d54/Goals_inner_details11.png" /> Elaborate actions and goal updates are also integrated in the experience for users who want to check-in detailed progress, through the check-in form. <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/31eada484d9379c141964f07693f740962223ad1ea9978683c38742eb4991edc/Goals_inner_newcheckin01.png" data-mid="118899974" border="0" alt="Scrolling the goals strip to view the goals relevant to the user, 01." data-caption="Scrolling the goals strip to view the goals relevant to the user, 01." src="https://freight.cargo.site/w/1000/i/31eada484d9379c141964f07693f740962223ad1ea9978683c38742eb4991edc/Goals_inner_newcheckin01.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/302e11c5a11b356a0f13f145035ce8b6348c030bca092190c805f681fcfc14ef/Goals_inner_newcheckin02.png" data-mid="118899975" border="0" alt="Scrolling the goals strip to view the goals relevant to the user, 02." data-caption="Scrolling the goals strip to view the goals relevant to the user, 02." src="https://freight.cargo.site/w/1000/i/302e11c5a11b356a0f13f145035ce8b6348c030bca092190c805f681fcfc14ef/Goals_inner_newcheckin02.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/2b6b19dcb074d09504dad0df118cfc7fdd5a8b1ae5bdbfc1d9c15f279ac7673f/Goals_inner_newcheckin03.png" data-mid="118899977" border="0" alt="User selects the action button in the Goal strip in Goals Hub." data-caption="User selects the action button in the Goal strip in Goals Hub." src="https://freight.cargo.site/w/1000/i/2b6b19dcb074d09504dad0df118cfc7fdd5a8b1ae5bdbfc1d9c15f279ac7673f/Goals_inner_newcheckin03.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/1fa43130a6b1730d29fddeaebd7e171f6dad872233d3359e7b7c0365c8f85180/Goals_inner_newcheckin04.png" data-mid="118899980" border="0" alt="Goal action menu presents the available actions." data-caption="Goal action menu presents the available actions." src="https://freight.cargo.site/w/1000/i/1fa43130a6b1730d29fddeaebd7e171f6dad872233d3359e7b7c0365c8f85180/Goals_inner_newcheckin04.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/f4db6f6910cba5c625abc6b8aad406650f165e1c3ea928bfe16ad20a86d37fc7/Goals_inner_newcheckin05.png" data-mid="118899981" border="0" alt="&quot;New check-in&quot; action opens the full check-in form." data-caption="&quot;New check-in&quot; action opens the full check-in form." src="https://freight.cargo.site/w/1000/i/f4db6f6910cba5c625abc6b8aad406650f165e1c3ea928bfe16ad20a86d37fc7/Goals_inner_newcheckin05.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/035de98ccff0caf3673b3ce27d493fe58b5a2d468f3b3d969ce869b65bdd969b/Goals_inner_newcheckin06.png" data-mid="118899983" border="0" alt="Tapping the value field pops up the keyboard." data-caption="Tapping the value field pops up the keyboard." src="https://freight.cargo.site/w/1000/i/035de98ccff0caf3673b3ce27d493fe58b5a2d468f3b3d969ce869b65bdd969b/Goals_inner_newcheckin06.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/1186c3937465386d9d4f8440c37cc8c9b36e9f1b720f9c8cf5e03dc302ffb79f/Goals_inner_newcheckin07.png" data-mid="118899984" border="0" alt="User fills out a new check-in with value, status and optional note." data-caption="User fills out a new check-in with value, status and optional note." src="https://freight.cargo.site/w/1000/i/1186c3937465386d9d4f8440c37cc8c9b36e9f1b720f9c8cf5e03dc302ffb79f/Goals_inner_newcheckin07.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/cdb9544e5ab8fe625eb66a27879cd7163243af6aa1bfcfc3e0e678746a695252/Goals_inner_newcheckin08.png" data-mid="118899985" border="0" alt="User confirms the new check-in and posts it." data-caption="User confirms the new check-in and posts it." src="https://freight.cargo.site/w/1000/i/cdb9544e5ab8fe625eb66a27879cd7163243af6aa1bfcfc3e0e678746a695252/Goals_inner_newcheckin08.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/dc0c9e71a8e94cc868456843907b8416180e230d2e02aff4c0b3d20aea280e00/Goals_inner_newcheckin09.png" data-mid="118899986" border="0" alt="The new value and status are updated in the goal card in the hub." data-caption="The new value and status are updated in the goal card in the hub." src="https://freight.cargo.site/w/1000/i/dc0c9e71a8e94cc868456843907b8416180e230d2e02aff4c0b3d20aea280e00/Goals_inner_newcheckin09.png" /> Tapping the goal card navigates the user to its scoracard. The user can explore the entire contextual field of the business area metrics and compare hers/his individual goals to the bigger picture. The detail panel action provide additional layer of context by navigating to the data the goal is connected to. <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/dd5ade75f099de5e10a339639dc76d8bfa058df3d4a322daa82ea55f4141a85c/Goals_inner_scorecard01.png" data-mid="118900199" border="0" alt="User taps the goal card to navigate to the connected scorecard." data-caption="User taps the goal card to navigate to the connected scorecard." src="https://freight.cargo.site/w/1000/i/dd5ade75f099de5e10a339639dc76d8bfa058df3d4a322daa82ea55f4141a85c/Goals_inner_scorecard01.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/29618f420978ad236e07c8ba6c329b6e55862872d3bb267d2806ec6ac034032a/Goals_inner_scorecard02.png" data-mid="118900200" border="0" alt="User selectd the goal from the scorecard to open the details panel." data-caption="User selectd the goal from the scorecard to open the details panel." src="https://freight.cargo.site/w/1000/i/29618f420978ad236e07c8ba6c329b6e55862872d3bb267d2806ec6ac034032a/Goals_inner_scorecard02.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/1888f38d1488bec8bf3d559ff86dd5ee6be147b19f07d4c805f72d48c685105f/Goals_inner_scorecard03.png" data-mid="118900201" border="0" alt="Tapping the three dot menu in the panel opens additional actions." data-caption="Tapping the three dot menu in the panel opens additional actions." src="https://freight.cargo.site/w/1000/i/1888f38d1488bec8bf3d559ff86dd5ee6be147b19f07d4c805f72d48c685105f/Goals_inner_scorecard03.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/8358941ed6965df15cb15cf106ca891d0fc9ec907cb202c72f04f6b8636ad5c2/Goals_inner_scorecard04.png" data-mid="118900202" border="0" alt="User can navigate to the report the goal is connected to." data-caption="User can navigate to the report the goal is connected to." src="https://freight.cargo.site/w/1000/i/8358941ed6965df15cb15cf106ca891d0fc9ec907cb202c72f04f6b8636ad5c2/Goals_inner_scorecard04.png" /> <img width="3840" height="1880" width_o="3840" height_o="1880" data-src="https://freight.cargo.site/t/original/i/7dda93086a9bed1c2ae919b051f9729de7236807df0fe2c57d164db9ec4c47a9/Goals_inner_scorecard05.png" data-mid="118900204" border="0" alt="User lands in the report and explores further the data metric." data-caption="User lands in the report and explores further the data metric." src="https://freight.cargo.site/w/1000/i/7dda93086a9bed1c2ae919b051f9729de7236807df0fe2c57d164db9ec4c47a9/Goals_inner_scorecard05.png" /> <img width="700" height="324" width_o="700" height_o="324" data-src="https://freight.cargo.site/t/original/i/99e0614b6f24f171e9a9c32ed3874adf454da54003eeab927c9c2594272c845b/GoalsHubNewnote.gif" data-mid="118929044" border="0" alt="Adding a new note to activity from the details panel in the scorecard. Live product." data-caption="Adding a new note to activity from the details panel in the scorecard. Live product." src="https://freight.cargo.site/w/700/i/99e0614b6f24f171e9a9c32ed3874adf454da54003eeab927c9c2594272c845b/GoalsHubNewnote.gif" /> <img width="324" height="701" width_o="324" height_o="701" data-src="https://freight.cargo.site/t/original/i/f18f5152b897456d609b64cabfff6954eca0149452cf809391f42561fed4b7fa/GoalsHubDetails.gif" data-mid="118928848" border="0" alt="Exploring the goals strip, viewing the detail panel. Live product." data-caption="Exploring the goals strip, viewing the detail panel. Live product." src="https://freight.cargo.site/w/324/i/f18f5152b897456d609b64cabfff6954eca0149452cf809391f42561fed4b7fa/GoalsHubDetails.gif" /> https://ziganna.me/Khan-Theatre Tue, 13 Jul 2021 16:54:37 +0000 Ziganna https://ziganna.me/Khan-Theatre ׳Khan׳ An identity redesign for the “Khan” theatre in Jerusalem Silver winner of Indigo awards 2018 [Role] Concept lead, Strategy, Visual design ‘Bezalel’, Visual identity, 2010 <img width="3840" height="2400" width_o="3840" height_o="2400" data-src="https://freight.cargo.site/t/original/i/73ca541c2f8ccc2f29f11a65c92631cdb8e5e07a0bec1e46aa7c72c1d62530c7/Khan_Cover01.png" data-mid="113755798" border="0" alt="&quot;Khan&quot; play poster from the play 'The Great Magic'" data-caption="&quot;Khan&quot; play poster from the play 'The Great Magic'" src="https://freight.cargo.site/w/1000/i/73ca541c2f8ccc2f29f11a65c92631cdb8e5e07a0bec1e46aa7c72c1d62530c7/Khan_Cover01.png" /> ׳Khan׳ is a seasoned repertory theater in Jerusalem that has a fixed image in the local eye. The concept of the redesign was to take the conventional theatre perception and deconstruct it, both in the metaphysical (identity) and physical (material) level. <img width="1600" height="1066" width_o="1600" height_o="1066" data-src="https://freight.cargo.site/t/original/i/d133050258f61a7ca02e033c6f1401af88dc9aac81b0ff479a3b3ef30c164a5c/Khanstreet05.png" data-mid="113800812" border="0" alt="&quot;Khan&quot; play redesigned poster in the streets of Jerusalem" data-caption="&quot;Khan&quot; play redesigned poster in the streets of Jerusalem" src="https://freight.cargo.site/w/1000/i/d133050258f61a7ca02e033c6f1401af88dc9aac81b0ff479a3b3ef30c164a5c/Khanstreet05.png" /> ConceptThe theatre graphic design will now ׳speak׳ direct language to the audience - all imagery was replaced with actual textual content from the plays of the theatre: posters and play brochures were stripped down from any image or picture from the show and replaced with quotes and verbal information about the play. The word is the image and the content takes the front of the stage, consequently, enables personal interpretation of the play by visualization in the mind of the reader. <img width="3840" height="2432" width_o="3840" height_o="2432" data-src="https://freight.cargo.site/t/original/i/e9d83db3190677c8f3c4ca0f05d4a64e67b527f98600fcb8881f8a087bc4c140/Khan_Inner03.png" data-mid="113861364" border="0" data-scale="95" alt="Poster from the play &quot;The Great Magic&quot;" data-caption="Poster from the play &quot;The Great Magic&quot;" src="https://freight.cargo.site/w/1000/i/e9d83db3190677c8f3c4ca0f05d4a64e67b527f98600fcb8881f8a087bc4c140/Khan_Inner03.png" /> <img width="3840" height="2432" width_o="3840" height_o="2432" data-src="https://freight.cargo.site/t/original/i/6f92079f859a61b2a23f1b894bf9d1d92ac54a2dc724ed93108fc1d3a39e6373/Khan_Inner02.png" data-mid="113861363" border="0" data-scale="95" alt="Poster from the play &quot;The Great Magic&quot;" data-caption="Poster from the play &quot;The Great Magic&quot;" src="https://freight.cargo.site/w/1000/i/6f92079f859a61b2a23f1b894bf9d1d92ac54a2dc724ed93108fc1d3a39e6373/Khan_Inner02.png" /> <img width="3840" height="2432" width_o="3840" height_o="2432" data-src="https://freight.cargo.site/t/original/i/7c4da4c1b9e18624890bd1d7b2124f14142ad6ee09f9f38c2adb9bc4383e05d8/Khan_Inner01.png" data-mid="113861362" border="0" data-scale="95" alt="Poster from the play &quot;The Great Magic&quot;" data-caption="Poster from the play &quot;The Great Magic&quot;" src="https://freight.cargo.site/w/1000/i/7c4da4c1b9e18624890bd1d7b2124f14142ad6ee09f9f38c2adb9bc4383e05d8/Khan_Inner01.png" /> <img width="3840" height="2432" width_o="3840" height_o="2432" data-src="https://freight.cargo.site/t/original/i/353f8d6543fa57616af5e32fb46a0c0da157841b721c820a6bf00e9be104fb17/Khan_Inner04.png" data-mid="113861365" border="0" data-scale="95" alt="Poster from the play &quot;The Great Magic&quot;" data-caption="Poster from the play &quot;The Great Magic&quot;" src="https://freight.cargo.site/w/1000/i/353f8d6543fa57616af5e32fb46a0c0da157841b721c820a6bf00e9be104fb17/Khan_Inner04.png" /> <img width="3840" height="2432" width_o="3840" height_o="2432" data-src="https://freight.cargo.site/t/original/i/e9d83db3190677c8f3c4ca0f05d4a64e67b527f98600fcb8881f8a087bc4c140/Khan_Inner03.png" data-mid="113861364" border="0" src="https://freight.cargo.site/w/1000/i/e9d83db3190677c8f3c4ca0f05d4a64e67b527f98600fcb8881f8a087bc4c140/Khan_Inner03.png" /> <img width="3840" height="2432" width_o="3840" height_o="2432" data-src="https://freight.cargo.site/t/original/i/6f92079f859a61b2a23f1b894bf9d1d92ac54a2dc724ed93108fc1d3a39e6373/Khan_Inner02.png" data-mid="113861363" border="0" src="https://freight.cargo.site/w/1000/i/6f92079f859a61b2a23f1b894bf9d1d92ac54a2dc724ed93108fc1d3a39e6373/Khan_Inner02.png" /> <img width="3840" height="2432" width_o="3840" height_o="2432" data-src="https://freight.cargo.site/t/original/i/7c4da4c1b9e18624890bd1d7b2124f14142ad6ee09f9f38c2adb9bc4383e05d8/Khan_Inner01.png" data-mid="113861362" border="0" src="https://freight.cargo.site/w/1000/i/7c4da4c1b9e18624890bd1d7b2124f14142ad6ee09f9f38c2adb9bc4383e05d8/Khan_Inner01.png" /> <img width="3840" height="2432" width_o="3840" height_o="2432" data-src="https://freight.cargo.site/t/original/i/353f8d6543fa57616af5e32fb46a0c0da157841b721c820a6bf00e9be104fb17/Khan_Inner04.png" data-mid="113861365" border="0" src="https://freight.cargo.site/w/1000/i/353f8d6543fa57616af5e32fb46a0c0da157841b721c820a6bf00e9be104fb17/Khan_Inner04.png" /> <img width="1685" height="1192" width_o="1685" height_o="1192" data-src="https://freight.cargo.site/t/original/i/e6648ecf0ecce41c97c4d81a47c19deb2a354cfa492973473ed8fdb00a58bbcf/Khan_itinerary03.png" data-mid="113841853" border="0" alt="Khan free choice plays program" data-caption="Khan free choice plays program" src="https://freight.cargo.site/w/1000/i/e6648ecf0ecce41c97c4d81a47c19deb2a354cfa492973473ed8fdb00a58bbcf/Khan_itinerary03.png" /> <img width="1685" height="1191" width_o="1685" height_o="1191" data-src="https://freight.cargo.site/t/original/i/26fa8d66a55c2b5097c717bf2cf774923e575d29a8af0d4ef1d0416ba1f8b9e4/Khan_itinerary02.png" data-mid="113841852" border="0" alt="Khan children's plays program" data-caption="Khan children's plays program" src="https://freight.cargo.site/w/1000/i/26fa8d66a55c2b5097c717bf2cf774923e575d29a8af0d4ef1d0416ba1f8b9e4/Khan_itinerary02.png" /> <img width="1685" height="1192" width_o="1685" height_o="1192" data-src="https://freight.cargo.site/t/original/i/ed5e6104339aa669585f24a88f1acf75fb75fe0db752d0fab3ea976f0d64b7f9/Khan_itinerary01.png" data-mid="113841851" border="0" alt="Khan plays program" data-caption="Khan plays program" src="https://freight.cargo.site/w/1000/i/ed5e6104339aa669585f24a88f1acf75fb75fe0db752d0fab3ea976f0d64b7f9/Khan_itinerary01.png" /> <img width="1685" height="1191" width_o="1685" height_o="1191" data-src="https://freight.cargo.site/t/original/i/c7190ec5bb33ad947ab619462aa7558503e0813cadd63e90068dd11cfab9bade/Khan_calender02.png" data-mid="113841850" border="0" alt="Plays calendar for October 2009" data-caption="Plays calendar for October 2009" src="https://freight.cargo.site/w/1000/i/c7190ec5bb33ad947ab619462aa7558503e0813cadd63e90068dd11cfab9bade/Khan_calender02.png" /> <img width="1685" height="1192" width_o="1685" height_o="1192" data-src="https://freight.cargo.site/t/original/i/38eb2a4494b111ca08a456639db728b3f788c41f320ebd61cb8934fe03d744fa/Khan_calender01.png" data-mid="113843894" border="0" alt="Plays calendar for November 2009" data-caption="Plays calendar for November 2009" src="https://freight.cargo.site/w/1000/i/38eb2a4494b111ca08a456639db728b3f788c41f320ebd61cb8934fe03d744fa/Khan_calender01.png" /> <img width="1685" height="1191" width_o="1685" height_o="1191" data-src="https://freight.cargo.site/t/original/i/0454b9fc80d8d9600605e75cb3901251ed17432553cd939532d80246e689b995/Khan_itinerary04.png" data-mid="113841855" border="0" alt="Khan subscriptions program" data-caption="Khan subscriptions program" src="https://freight.cargo.site/w/1000/i/0454b9fc80d8d9600605e75cb3901251ed17432553cd939532d80246e689b995/Khan_itinerary04.png" /> Manufacturing methodThe printing materials were driven by the ׳what’s available in the print house׳ approach: standard A4 or A3 wood-free papers. Same was applied to the color of the outputs - use what is available in the print house. This manufacturing approach set the structure of the printing materials as well: no more conventional brochures with paper clips or glue bindings. The outputs will now be ready made stand alone pages that are easy to handle and cost-efficient to print. Form follows functionVarious content types were fit to accommodate a single page (one sided print or two). Providing digestible content with the free choice of the type of content the viewers want to digest (what paper to pick and take, rather than receiving a pre-set brochure with the content already chosen for them). <img width="1536" height="2048" width_o="1536" height_o="2048" data-src="https://freight.cargo.site/t/original/i/ca34b5dfd9abb439cf4a9e8017747428a4331ff0c9976310d87b32ea6e560ad8/Khan_pic02.png" data-mid="113845275" border="0" alt="&quot;Khan&quot; play marketing materials" data-caption="&quot;Khan&quot; play marketing materials" src="https://freight.cargo.site/w/1000/i/ca34b5dfd9abb439cf4a9e8017747428a4331ff0c9976310d87b32ea6e560ad8/Khan_pic02.png" /> <img width="950" height="667" width_o="950" height_o="667" data-src="https://freight.cargo.site/t/original/i/f6efba631a9799379ce3b37f8c2f20b46a916018326b31de2640ff894de1fdd2/Khan_pic01.jpg" data-mid="113845274" border="0" alt="October play schedules" data-caption="October play schedules" src="https://freight.cargo.site/w/950/i/f6efba631a9799379ce3b37f8c2f20b46a916018326b31de2640ff894de1fdd2/Khan_pic01.jpg" /> <img width="2048" height="1536" width_o="2048" height_o="1536" data-src="https://freight.cargo.site/t/original/i/c5ba75729bef955f53ca5b40278a47a7c9749c364277d790b7ef81a68a2097fb/Khan_Brochures02.png" data-mid="113843885" border="0" alt="The play &quot;The Great Magic&quot; brochure pile" data-caption="The play &quot;The Great Magic&quot; brochure pile" src="https://freight.cargo.site/w/1000/i/c5ba75729bef955f53ca5b40278a47a7c9749c364277d790b7ef81a68a2097fb/Khan_Brochures02.png" /> <img width="950" height="667" width_o="950" height_o="667" data-src="https://freight.cargo.site/t/original/i/0b19d67572e4125e853722f3da46904f352a34fb0e0887caa73563b071d41f86/Khan_Brochures04.png" data-mid="113843887" border="0" alt="The play &quot;The Great Magic&quot; brochure content" data-caption="The play &quot;The Great Magic&quot; brochure content" src="https://freight.cargo.site/w/950/i/0b19d67572e4125e853722f3da46904f352a34fb0e0887caa73563b071d41f86/Khan_Brochures04.png" /> <img width="950" height="667" width_o="950" height_o="667" data-src="https://freight.cargo.site/t/original/i/00b3fb3a11ad2e360696e0a7feda53f9d3d6b149043296bf07d3061ee620b17d/Khan_Brochures03.jpg" data-mid="113843886" border="0" alt="The play &quot;The Great Magic&quot; brochure content" data-caption="The play &quot;The Great Magic&quot; brochure content" src="https://freight.cargo.site/w/950/i/00b3fb3a11ad2e360696e0a7feda53f9d3d6b149043296bf07d3061ee620b17d/Khan_Brochures03.jpg" /> Marketing The materials and manufacturing enabled the marketing of the theatre on the street level, “lowering” the theatre from its high pedestal and making it more approachable. <img width="1200" height="800" width_o="1200" height_o="800" data-src="https://freight.cargo.site/t/original/i/1ee205e6b016d0ade1f48dfeaa2f2a7a966c4e8a32ed91e22b3c6ba3294b9d90/AnnaZigan_TheatreKhan_Poster03.png" data-mid="113791804" border="0" alt="&quot;Khan&quot; play posters hang around the city" data-caption="&quot;Khan&quot; play posters hang around the city" src="https://freight.cargo.site/w/1000/i/1ee205e6b016d0ade1f48dfeaa2f2a7a966c4e8a32ed91e22b3c6ba3294b9d90/AnnaZigan_TheatreKhan_Poster03.png" /> <img width="1597" height="1105" width_o="1597" height_o="1105" data-src="https://freight.cargo.site/t/original/i/0ae70dfd5e32649a7356edf6432967e32c353d8f2cc1576fd66eb8da267082d8/Khanstreet03.png" data-mid="113799250" border="0" alt="&quot;Khan&quot; play poster among other events on the postal board" data-caption="&quot;Khan&quot; play poster among other events on the postal board" src="https://freight.cargo.site/w/1000/i/0ae70dfd5e32649a7356edf6432967e32c353d8f2cc1576fd66eb8da267082d8/Khanstreet03.png" /> Click here for a deeper dive to the project&nbsp;(Mesmerizing beauty and typographic delight is insured :)