Reducing costs by 80% for Maritime Communication and Operations

After the successful delivery of Stage 1, the client continued to work with Imaginary Cloud on a continuous development basis, adding more features to its product to fuel its growth. The team worked on many different elements, from payment integrations to sales campaign tools to facilitate marketplace promotional campaigns. Imaginary Cloud also helped Flipped Normals improve its Google positioning by implementing an SEO audit, which tweaked the site’s performance and content relevancy.

We formulate an approach to the product based on the user's needs and the business model.
This is the core of the creative process and it is where the concept of the product is formulated based on the user's needs and the business model (both identified in the Research phase). Here, the UX designer, the product designer, and the product owner work closely together.

This stage consists of 4 steps: mapping out the user journey, by describing each user's action, with various user scenarios; a decision matrix that helps prioritize the users' and product's goals while considering the product life cycle's current stage; drawing the wireframes, i.e., the pages’ structure and navigation flow to ensure interface usability and reduce design time; and finally, a mood board to ensure that the product's look and feel conveys the desired user experience and is aligned with the user profile and market strategy.

We bring the concept to life and put it into practice.
In this stage, the product designer focuses on creating a physical representation of the concept that has been defined up to this point.

It consists of 3 steps: a style guide, where we define a graphic interface’s style, considering colour palette, fonts, image style, input fields, buttons, and so on, to ensure consistency throughout the application; a graphic user interface design (GUI) which are the end-looking screens by applying the style guide to the wireframes; and a click-through prototype to facilitate the feedback from stakeholders or potential users and investors.

We guarantee that all requirements and ideas generated are realistic to implement.
In this stage, all the work previously done should be achievable considering the available time and budget previously settled.

It consists of 2 steps: a high-level architecture where we detail how the product will be built, identifying baselines for the needed technologies and skills to make it; and a project plan to define the major milestones and provides a general understanding of the project's structure, phases, intersections and interdependencies.

During the ideation phase, we provide the blueprint and structure for the whole website, which defines the relative importance of content as it flows down the page.

The site map establishes the website's structure and content hierarchy for optimal navigation. Wireframing outlines screen structure and navigation flow, prioritizing your digital product’s functionality over aesthetics. Lastly, for the content ideation we help you plan the page content, providing guidelines for audience-adapted material.

During execution, we deliver the first significant page, typically the home page, ensuring it aligns with your target audience and market strategy. We then apply style to wireframes through GUI design, focusing on visual aesthetics and maintaining consistency across the website. Our Webflow development process follows best practices, incorporating interactions, animations, and responsiveness across devices.

Finally, we present results on a test domain, with client involvement being crucial for a successful outcome.

We provide your teams with comprehensive training sessions and Q&A opportunities to empower them to autonomously manage the content. We offer ongoing support, ensuring all necessary information for website updates is readily available, and we configure permissions within Webflow as needed.

Additionally, we seamlessly integrate the website with essential marketing tools such as Google Analytics, configure SEO optimizations, and seamlessly migrate and connect the desired domain. Leveraging Webflow's reliable hosting services, we ensure the website is published with optimal performance and reliability.

In this stage, we put in place a briefing that includes the information gathered during the workshop with the team and stakeholders. It presents the vision and goals of the project and clarifies all necessary business requirements. This is also where a FAQ session relative to the nature of the project takes place.

The high-level architecture involves the development of the technical design, with the ideal balance between complexity and reach. This is where we identify external dependencies from third-party providers, such as Stripe, Facebook, Amazon, and so on.

We then start the CI/CD workflow which is the setup of the issue management tool, code repositories, continuous integration system, and development & staging environments. It’s followed by the setup of the code repo and automated test framework, the staging environment and production servers, as well as the continuous integration ecosystem (i.e. servers, deploy hooks)/continuous deployment.

Finally, in Feature 0 we deliver the first meaningful feature: a homepage, a login screen, part of the first dashboard. This step ensures that there is something demonstrable with the perception of value at the end of the phase.

With the Data Model, we provide the first baseline of the product’s evolutive data model. It identifies the main data entities and relationships and baselines the data sources and data stores (i.e. relational databases, document data stores, etc.). This step also consists of iterating the product concept and designing the first version of the data model.

Here’s when we present the Proof Of Concept (PoC), Minimal Testable Product (MTP), or Minimal Viable Product (MVP), and we deliver and deploy the first version of the product - even if that version is the implementation of a concept. This helps mitigate technical risks and test the main business premises for developing a market-ready version of the product through a viability assessment.

On the production increments step, we review technical and business risks and the impact of the PoC, MTP, or MVP on the initial premises or Wave 0. Here, we also identify reusable components from Wave 0 to Wave 1 (i.e. often PoCs are not reusable). This helps gather feedback about the first integrated model and assesses the product's viability before moving to Wave 1.

Finally, the wave retrospective reviews the product state, evaluates wave success against business goals, and identifies improvements. We then design goals for the next wave & prioritise features. Doing this allows the team to analyse the work that has been done in previous sprints and plan consciously what should be the next mountain to climb.

We proceed to execute the Code Review by looking at Architecture to understand how the product is built, its principles, and its patterns.

Now it's time for a Test Review, where we assess unit tests, code coverage, and test quality.

We follow up with a Code Quality Review, where we list all the issues and describe them to the fullest, identifying the critical ones and categorising them.

We close the process with an Assessment stage where we list all recommended fixes and provide an estimate of the resources needed to implement them.