Stratomat is a web-based productivity application designed for the communication management of strata corporations by property managers or stratas directly. Strata corporations are responsible for managing residential, commercial, and mixed-use buildings, and require effective communication channels between property managers and owners. Stratomat was developed to streamline this process and provide a user-friendly platform for efficient communication and collaboration.
- eCommerce
- Membership Management
- Brand + Positioning
- Responsive Web Application
-
intro
The main technological challenge faced during the development of Stratomat was to create a web-based application that streamlined communication management while also being user-friendly and easy to navigate. The application needed to integrate various components such as user authentication, permissions-based access to file systems and retrieval, real-time messaging, and notifications, all while maintaining a high level of data privacy and security. Additionally, Stratomat needed to be scaleable, so that it could handle increasing user numbers and data volumes, as well as remain flexible to accommodate future upgrades and new features. The goal was to provide a robust and reliable solution that would solve the communication challenges faced by property managers and stratas, while ensuring a seamless user experience for all parties involved.
-
Stratomat desktop dashboard and mobile login page
Developing the site architecture and user experience for Stratomat presented a number of technical challenges, primarily that the site architecture had to enable fast and efficient access to data, while minimizing processing time and ensuring high availability. It was critical that the application provide fast and responsive performance to ensure that users could access information and generate results quickly and efficiently. This required optimizing the site architecture to minimize page load times, reduce server response times, and ensure smooth navigation. As the application dealt with sensitive data, it was essential to ensure the highest levels of data privacy and security. The architecture had to incorporate industry-standard security measures such as data encryption, secure login and authentication, and access controls to prevent unauthorized access to data.
-
Stratomat hand-drawn wireframe
-
Stratomat sitemap and entity diagram
To ensure an intuitive user experience for Stratomat, extensive usability testing and continuous user feedback analysis was necessary. Use case testing involved identifying specific scenarios that users might encounter and testing how the application would respond. This helped to identify areas where the application was not meeting the needs of users and enabled the Tugboat team to make the necessary adjustments to improve the user experience.
Information workflows were also an essential part of creating a logical user experience. This involved mapping out how information flows through the application and how users would interact with different data sets. By creating workflows, the team could identify potential bottlenecks or areas where users might get stuck, and make changes that made it easier for users to find what they were looking for.
Once these steps were completed on paper, the development team created a prototype of the application. The prototype was then tested with real users to gather feedback and identify any areas that needed refinement. Based on this feedback, developers could then make changes to the design and functionality of the application, fine tuning it until it provided a seamless and intuitive user experience that met the needs of its users.
-
Issue Page
-
Mobile slide - Create the Issue
-
Issue Detail Modal Window
-
Stratomat Dashboard
-
Create - Add new BOTH 3 LINKS
The Stratomat brand was developed in conjunction with the core application development. While this did prove to be an effective strategy for ensuring consistency and cohesiveness between the brand and the product, it also presented challenges in balancing the need for creativity and innovation with the practical considerations of developing a functional product.
It was important to ensure that the visual design of the brand did not come at the expense of the functionality and usability of the application. Tugboat's brand creative team worked closely with the development team to ensure that the design elements were technically feasible and did not compromise the user experience. This required timely communication and collaboration between the two teams.
Given that the application has a white label use case, it was crucial that the brand not overshadow the product. It was important to strike a balance between the visual identity of the brand and the core purpose of the application. We had to ensure that the brand supported and enhanced the user experience of the application, rather than detracted from it.
To mitigate these risks, effective collaboration and communication between the brand and development teams were essential. Both teams worked together to ensure that the brand and application were aligned in terms of design, functionality, and user experience. By doing so, the resulting product was not only visually appealing but also highly functional and user-friendly.
-
Colour guide
-
Typography Guide
-
Button
-
Icon
-
Status Colour
-
Branding & UI
CSS, styles, and GUI development were the essential processes that brought the wireframe pages to life. Once the page structure had been created, the next step was to apply design elements such as typography, colours, and imagery to the page views. This involved creating custom CSS styles that defined the layout, design, and behaviour of the page elements such as buttons, menus, and forms. The GUI development process involved converting the wireframe pages into functional web pages that were responsive and compatible with different browsers and devices.
The CSS and GUI development process was exciting as it involved taking the static wireframes and turning them into dynamic and interactive pages that users could interact with. This stage of product development requires a combination of technical skills and design expertise to ensure that the pages were not only functional but also visually appealing and intuitive to use. This, too, was an itterative process, where the pages and progress was tested thoroughly to ensure that they met the design and functional requirements and provided a seamless user experience.
-
Dashboard
-
Detail Issue Page
-
Mobile Dashboard
Establishing an effective responsive design strategy for Stratomat was a significant challenge due to the size and information display requirements of the application. The design team had to come up with a solution that could handle the complex and dynamic display of information on different devices and screen sizes. This required creative and technically advanced coding techniques that could adapt to the user's screen size and device. The team used advanced CSS techniques such as media queries, flexible grids, and fluid typography to create a responsive and flexible design that achieved this.
The design team's ingenuity and creativity played a crucial role in establishing an effective responsive design strategy for Stratomat. Their technical expertise and innovative coding techniques helped to create a visually appealing and functional application that was accessible and user-friendly across different devices and screen sizes.
-
Responsive layout
Phase one of Stratomat is now live and available for use. The platform's launch has been a great success, and we are excited to offer a powerful communication management tool for strata corporations. Stratomat offers an intuitive user interface, extensive functionality, and is optimized for usability and accessibility. We invite you to visit the site and experience the benefits of Stratomat firsthand. Whether you are a property manager or a member of a strata corporation, Stratomat has the tools you need to manage your communications effectively.
Let's talk about your web development application or product.
