app icon

Skywatch View

An elegant solution for smart places

holding device

Overview

Skywatch is an elegant solution for smart places. It is designed to seamlessly integrates network camera, environmental sensor, switches with cloud recording and smart notification services.

• • • • • •

My client, Skywatch Innovation, is a startup company providing service of cloud-based platform for IoT devices, in particular for video streaming devices. Their focus is to develop reliable, simple-to-use surveillance products and services for consumers and small businesses.

Some of the wireframes and design elements were altered during the development. The initial wireframes shown here is designed by me. The final flow is discussed with and finished by Ailsa Chen. The company logo is redesigned for the sake of my interest, not of our contract.

Time

Jun - Sep 2015

My Role

Interaction Design
Visual Design

Company

Skywatch Inc.

Mobile App Interaction Design

01

Wireframes and UI Flow


Consolidating ideation and visualizing concepts via wireframing which is something more tangible for communication. A part of preview of the initial flow design and wireframes which consist of 40+ screens is shown.

Brand Design

01

Logo


The original brand logo, which matches home image, is cute and soft. But service is for not only home users but also enterprises, so the new logo is designed to enhance the trustworthiness and reliability images.

02

Color Themes and Style Guidelines


Color themes and style guidelines are created during the design process to pursue the consistent design lanuage.

Mobile APP Visaul Design

02

iOS App


Look past the UI to the app’s core functionality and affirm its relevance. Use the themes of iOS to inform the design of the UI and the user experience.

Onboarding

iOS screen
iOS screen
iOS screen

Registration

iOS screen
iOS screen

Adding Devices

iOS screen
iOS screen
iOS screen

Navigation Menu
and Group Overview

iOS screen
iOS screen

Cam Details

iOS screen
iOS screen

Sensor and
Actor Details

iOS screen
iOS screen
iOS screen

Timeline and
Rules

iOS screen
iOS screen
iOS screen

03

Android APP UI


Create a visual language for users that synthesizes the classic principles of good design with the innovation and possibility of technology and science.

Navgiation Drawer
and Group Overivew

Android screen
Android screen

Sensor, Cam
and Actor Details

Android screen
Android screen
Android screen

Timeline
and Rules

Android screen
Android screen
Android screen

Web App Design

01

Multiple browsers


Multiple platforms are supported for you to stay connected to your loved ones. Simple network connectivity, remote camera management, smart event alerts, in a single service.

02

Light Theme


Light theme provides simple and clear images for home users.

Cam View

Group View

03

Dark Theme


Dark theme has stable and calm images as business theme.

Gateway Device View

Timeline

Rules