CRISP STUDIO
[/] UX/UI DESIGN STUDIO Home About hi@crisp-studio.com VR360 Design & development for a VR video streaming cross-platform mobile app Client Mecha Technologies, USA Scope Concept design, UX/UI Design, PWA Development Released November 2018 Tech Stack Vue.js, A-Frame.js, Laravel, HLS.js, Videojs-vr SOUND ON SOUND OFF play Mecha VR ® is a mobile application for watching or streaming stunning moments in VR 360° video format. The mobile app runs on Mecha ® video streaming platform and allows authors to share and promote their VR-content in a single place. Experience Design Despite there are dozens of video streaming apps now, there were no dedicated VR video mobile apps/platforms at the moment. Twitch Wowza Vimeo Live YouTube Facebook Live Periscope Brightcove Kaltura Netflix VR Comparison of live broadcast platforms We investigated the possibilities and limitations of VR-streaming in browser-based mobile apps (PWA) like supported cameras, file sizes, mobile device support, and brought the best of it to a working demo. UX-stage took us here the most. Before the final design, we iterated approach several times to discover optimal flow both for streamers & end-users. Mecha proprietary Face Login technology allows registered users to login with the front camera on the authorized device. Depending on the plan, streamers can select the video quality and connect different media sources for a cast. While user onboarding, we emphasize the idea of content with a gyroscope - when you rotate the device in space, slides with a description change. App Development In terms of development, the challenge to bring media streaming to PWA: there was no existing libs & browser support was quite limited. As a part of the solution, we created a front-end app (vue.js) that stays in between the mobile app and media server (node.js), has media caching, and automatically adopts stream to user's devices capabilities. Tech stack Cross-platform PWA VUE.js NODE.js 100 0 Days to design and create a working PWA App 32 0 Wireframes & Design frames created 11 0 uses interviewed at the research stage 17 0 devices tested for compatibility “Mecha VR is a venture project. We aimed to create to extract maximum value to the app in minimal terms & budget. Crisp design and dev team managed it to happen flawlessly.” CONOR ROBINSON, CTF, CEO Want to make something great? Let’s make it happen! +41 79 454 05 45 hi@crisp-studio.com book a meeting estimate your project Crisp Digital Ventures LTD 86-90 Paul Street, London, England, EC2A 4NE VIEW NEXT CASE Innovecs: New Visual Identity & Website