DotHub Share: Async Labs Score Awaiting client review n/a Date Published 9 March 2021 Reading Time 3-Minute Read DotHub is an automation platform that replaces a variety of remote controllers within a single device and app. About DotHub is a cloud solution that provides full control and telemetry data for users to manage multiple devices and monitor their state. With the DotHub platform, there is no need for numerous remote devices as users can easily control all of them within a single device and app on their phone. While it can be used as the perfect home automation solution for opening gates and barriers, DotHub also opens one more important thing: many industry possibilities. DotHub’s vision of the future is automated and shared mobility between people, MaaS, and transport service providers connected as dots in the “DotHub network.” Challenge Behind the DotHub solution is the Zero Molecule team. Our client knows that successful project ideas need an attractive visual identity and professional style guide for future steps of implementation. We are responsible for creating the DotHub logo and brand book, based on their vision and our research. The second part of the client’s requirements was the user interface design. The user interface should be designed for iOS and Android platforms and deliverable for a Flutter environment. According to the existing UX guidelines, the user interface should display the mobile application’s core features: user login, device pairing, adding new devices, and manipulations on added devices. The design should be clean, modern and indicate the main functionality of the mobile application. Solution Because the idea of DotHub is to manage many remote devices within a single mobile application, the logo represents dots gathered in a single center in the shape of the letter “D”. A brand book, or a brand style guide, is a document that sets specific guidelines for perpetuating brand identity in all external and internal communications. In the brand book, we described the use of the DotHub logo, color, the use of typography, and image manipulation. In keeping with the visual identity, we have created a UI style guide that defines components, icons, colors, typography, and animations for the mobile application interface. The next step was to create screens for user onboarding, registration/login, device pairing, the main screen with added devices, settings, etc. The UI clearly broadcasts the mobile application’s essential features, and special attention is paid to creating simple and straightforward steps for pairing remote devices. By connecting the designed screens, we made a design prototype of a mobile application. Results We have successfully defined the project’s visual identity, with a logo representing the central vision of the DotHub platform. The professional visual identity attracted the attention of project investors and gave visual impetus to the initial idea. A modern and simple user interface meets the needs of target users for this type of mobile application. Consistent design with a functional design system allowed the easy client implementation of design in a Flutter environment. Our design team was supportable and suggestible for new requests and changes in the mobile app development phase.