RoomRenderAI: Mobile app for renovation inspiration


Home renovations can be a huge stress that includes choosing the designs, having a vision, contacting contractors, getting quotes, and communicating your vision. To make this process easier, the team at Focus21 and I developed RoomRender AI in collaboration with Triforce Construction. This mobile app facilitates the initial stages of interior design by providing quick visualizations based on user preferences and currently holds a 5-star rating on the App Store.

Please note that I have omitted and obfuscated any confidential information in this case study due to an NDA. The information in this case study is my own and does not necessarily reflect the views of Focus21 or the client.

Primary Role

UI/UX Designer

The Team

Triforce Team

1 Designer

1 Mobile Developer

1 AI Developer

1 PM

Timeline & Status

September 2020 - May 2021

Meet Lindsay, a 29-year-old woman, is expecting her first child and feels anxious about preparing her home. She and her husband want to convert their old office into a nursery but struggle to visualize their ideas. With a tight budget and a perfectionist mindset, Lindsay needs a way to confidently make design decisions for the nursery.

Lindsay puts her vision into RoomRenderAI to generate inspiration

Build it, and more features will come

When we started working with Triforce Construction, they had big plans for the product, including lots of cool features for future versions. Our job at Focus21 was to come up with a plan to build and MVP, then implement Version 1 (V1) with monetization.

RoomRender AI Design Process

Deployment of MVP
Redesign for V1
Deployment of V1

User stories

In order to identify valuable features for users, we wrote stories that describe the common thoughts and goals people have when they're looking for ideas to renovate their homes using the MVP product.

Custom Design Inputs

As a user, I want the app to allow me to input my design preferences easily, so I can customize the inspiration according to my tastes and preferences.

Rendered Image Generation

As a user, I want the app to generate rendered images based on my inputs, so I can visualize how different design elements would look in my home.

Save and Compare

As a user, I want the app to provide the option to save the rendered images, allowing me to revisit and compare different design ideas at my convenience.

Social Sharing

As a user, I want the app to enable easy sharing of the rendered images to social media platforms, so I can gather feedback from friends and family or simply share my design inspiration with others.

Scalable Architecture

As a user, I want the app to have a scalable backend and frontend architecture, ensuring smooth performance and usability as the user base and features of the app grow over time.

Platform Accessibility

As a user, I want the app to be available on both iOS and Android platforms so that I can access it regardless of my device preference.

Building a scalable MVP with basic features to start

Following discussions with stakeholders, we used the Kano Model Theory to define the features that make up the MVP.

Be available in iOS and Android

Allow users to input design preferences

Use generate rendered images based on inputs

Allow users to save the renders

Allow users to share to social media

Have a scalable backend and frontend

User flows

After defining the features within the app, we created user flows to organize tasks per feature. To quickly summarize the flows:

  • Questionnaire: When the user wants to generate a new idea, the complete a questionnaire that was provided by the client that helps gather information for ChatGPT. The information is then inputted into DreamStudio to generate the image.

  • Post-Image Generation: The user can either regenerate images (must watch an ad), download the image to their device, save the image to their in-app gallery, or share to social media.

  • Onboarding: The user must accept Terms & Conditions before continuing into the app.

  • Share to social media: When viewing the image, the user can select the share icon and select where they would like to share it to.

  • Save to gallery: After generating a new image they can save it to their gallery either in an existing folder or a new folder.

  • Regenerate: If the user does not like any of the rendered images, they can select regenerate to get four new renders.

  • Generate Remastered Ideas: The user likes an image and wants to generate similar ones, so they select the render and select reimagine to generate three renders similar to the original.

Bringing the user flows to life

Wireframes were built to complement the user flows, helping us to iron out any potential issues in the user experience, ensure proper connections between screens, and validate our information architecture.

The wireframes do not represent the actual wireframes used during this project.

Design system for consistency and scalability

Designing a design system ensured consistency and accessibility throughout the app, facilitated scalability for future features, and simplified the implementation of brand and design adjustments. I gathered branding information from the client and collaborated closely with the developers to ensure the feasibility and scalability of UI components, and also worked with the client to ensure the style aligned with their satisfaction.

The design system encompassed the fundamental elements necessary for creating the MVP:

  1. Colours

  2. Typography

  3. UI Components (fields, buttons, navigation, dropdown fields, and specialized components)

  4. Icons

The design system above does not represent the actual design system used during this project.

Quick-and-Dirty Usability Testing

Due to the timeline and budget of the project, I had to be efficient with my time. I simulated the user flows with my "user eye" and "designer eye" to identify dead ends, areas of frustration, or confusion. Below is an example of an improvement:

Gallery V1
Gallery V2

Galery V1 to V2:
- It was easier to develop V2 and not overlay the image placeholders on one another
- The number of renders in each folder was added to provide more useful information at the high-level screen

Handoff and MVP Mockups

For the official handoff to developers, I produced Figma documentation that consists of all of the possible user flows, the specs (if necessary), and the different states of the components involved in the respective flow. An example is shown below:

Putting it all together, we were able to create an awesome MVP! Check out some mockups below:

Selecting the monetization strategy

After the MVP was built, a monetization strategy was developed to help cover the overhead of the renderings. After researching different options, the following payment model was selected:

Free Version: The default version when the user opens the app.

  • Limited render results (only displays 1 of 4)

  • Must watch ad before image is rendered

  • Cannot upscale to high-quality renders

Basic Version (in-app pay): Users can upgrade through an in-app purchase.

  • 40 render credits which count towards render cycles and upscaling

  • Once render credits are up, the user gets downgraded to the free version

  • Can render 4 images at a time

How will the user interact with the ads

Obviously, advertisements and paywalls significantly impact the user experience, so I made sure I followed the tips below:

  • Seamless Integration: Ensure ads blend smoothly into the design without disrupting user tasks.

  • Relevance and Targeting: Place ads based on user preferences and behaviour for better engagement.

  • Transparency and Privacy: Clearly indicate ads, offer user control, and respect privacy regulations.

In collaboration with the stakeholders, I made user flows of all the interactions with the opportunities to upgrade.

RoomRender AI continues to evolve!

Ultimately, the feedback from users has been overwhelmingly positive. RoomRender AI currently holds a 5-star rating based on 14 total ratings. Moving forward, new versions of RoomRender AI are in development, and it continues to evolve into a highly impactful application within the home renovation industry.


total ratings

5.0 / 5.0


Talking to the end-user is SO important!

"I am blown away! It's almost like magic. It's so easy to just answer the questions and have your ideas come to life. I'm addicted. This saved me a tone of times trying to explain my ideas to a designer now I can just give them renders I created and they can literally see what I wanted."

“We were unsure whether our project was feasible and the fact that Focus21 could pull it off was exceptional. What an impressive team!”

Greg Curtis, Owner of Triforce Property Management Inc.

Check out these other case studies!


Long-Term Care Home Bedsore Tracking