ArchiVinci AI
2024
UX/UI design
AI integration
responsive web+mobile
branding
product management
art direction
motion design
2023 marked a pivotal year for the integration of Artificial Intelligence (AI) into various industries. During this transformative period, the architectural community experienced a paradigm shift as professionals and enthusiasts alike recognized the vast potential of AI in their field.
MY ROLE
I've been in charge of product and design management for ArchiVinci AI right from the start. We began by understanding how to integrate AI into our system, then we discovered suitable systems, designed user interfaces, improved usability, managed databases, and after the launch, we closely observed user feedback and support data to identify any issues.
Based on user needs, we continuously enhanced the product by adding new modules.
Early Insights from the Field
I conducted market research, collected user feedback on similar AI tools to reveal valuable understandings and transform ideas into functionalities that cater to customer behaviours and motivations.
I developed frameworks and prototypes to communicate the vision, design principles, and content strategy effectively. This facilitated the promotion of ideas, achieved alignment, and guided decision-making processes.
Guiding Principles and Decision Making
I worked closely with project partners to define the product, emphasizing customer goals while aligning with business objectives. I prioritized and negotiated features for launch and ongoing development.
Planning Product Priorities
I crafted designs for four distinct devices. My responsibilities encompassed ideating early concepts, running design sprints, creating user journeys, wireframes, prototypes, and detailed design specifications for each device size.
Design Execution & Validation
I developed designs and presented them to gain approval from partners, and various teams during the project's lifecycle.
Product & Design Leadership
THE CHALLANGE
Since the beginning, Archivinci AI has seen changes in the architecture and design field. As digital renderings become more popular, we've adapted the platform to meet users' needs. The goal is to match what customers want and compete well in the market.
Archivinci AI offers something new: it lets users easily create unlimited beautiful interior and exterior renders in seconds. The platform gives users lots of design choices, making it easy to bring their ideas from sketches to life. I aim to impress customers right from the start, making strong connections by offering top-notch rendering solutions that fit their needs.
Captivate Users from the Get-Go
As we know, there are many architects and architecture students in the market, and there are also various AI tools doing different jobs. In our research, we noticed that these tools rely on AI API requests from service providers on a credit-based system, which ends up making their products expensive for end-users.
We investigated that rendering could be done more affordably and quickly without compromising the precision of the produced renders. With the in-house AI integration method we found, we established a system that offers customers the chance to generate unlimited renders without credit-based limitations, at 60% cheaper than other companies.
After the tool received intense interest in its first month, we shortened the rendering time by increasing the number of servers and optimizing the code and AI model, enabling renders to be obtained in 11 seconds, which is 75% faster than competitors.
Precise - Fast - Cheap Product
As we know, there are many architects and architecture students in the market, and there are also various AI tools doing different jobs. In our research, we noticed that these tools rely on AI API requests from service providers on a credit-based system, which ends up making their products expensive for end-users.
We investigated that rendering could be done more affordably and quickly without compromising the precision of the produced renders. With the in-house AI integration method we found, we established a system that offers customers the chance to generate unlimited renders without credit-based limitations, at 60% cheaper than other companies.
After the tool received intense interest in its first month, we shortened the rendering time by increasing the number of servers and optimizing the code and AI model, enabling renders to be obtained in 11 seconds, which is 75% faster than competitors.
“We weren't expecting a 'yes' to our product, but we were aiming for a 'WOW' at first sight.”
I conducted customer and market research to guide our planning stage. These are the main findings that shaped the initial version of the product.
Customer Insights
THE DISCOVERY
Efficiency is paramount
Users prioritize precision
Users rely on Archivinci for rapid solutions, desiring the ability to quickly sketch or capture an image and generate final architectural renderings within seconds, underscoring the program's time-saving features.
They seek highly accurate and detailed outcomes from Archivinci, emphasizing the importance of precise results in their design projects.
Accessible for non-experts
Individuals with limited knowledge of architecture and design turn to Archivinci for affordable architectural guidance, indicating a demand for accessible and cost-effective design solutions among novices.
Deeper Insights
Users opt for Archivinci because they lack the expertise to create photorealistic renders using other software, appreciating its user-friendly approach.
Users choose Archivinci to avoid long wait times for renders, preferring its faster processing speed.
Simplified usage
Faster Rendering
No Credit-Based Usage
Recognizing AI's Limits
Iterative Process in Architecture
Smooth Customer Experience
Future Personalization
Unlimited credits for high quality renders
THE VISION
We did not want to offer credit-based usage, rather wanted to focus on helping customers generate as many renders as they want, Due to the current limitations of ai, the generated renders may not always provide the exact desired outcome. Especially in architecture, it may be necessary to make several attempts to capture the desired texture and lighting.
Our customers expect and trust us to provide a smooth flow for them. We envisioned the future of the architectural ai service to be deeply personalised to customers' needs & projects.
“Our aim was for customers to shout about the value we deliver.”
Introducing ArchiVinci AI
THE SERVICE
In the platform, users have the power to customize their rendering experience by selecting their preferred similarity level. This intuitive feature allows them to effortlessly navigate between creative exploration and hyper-realistic rendering, ensuring a seamless and tailored user experience.
Choosing Similarity Level:
User Empowerment
With the flexible pricing plans, users can use unlimited render credits, enhancing their experience by removing constraints and allowing for uninterrupted experience. This user-centric approach ensures a smooth and seamless rendering process, fostering a more enjoyable and productive design journey.
Unlimited Render Credits: Flexible Pricing
.webp)
The user dashboard provides easy access to past renders, streamlining the user experience by ensuring that users can quickly review and reference their previous work. This intuitive feature promotes continuity and efficiency in the design process, enabling users to focus on their creative vision.
Seamless Access to History:
User Dashboard
How We Got There
THE FRAMEWORK
Three primary questions informed my design strategy:
How do you design for everyone, everywhere?
1
Which contexts need to be prioritized?
2
What do our users typically do with these renders?
3
In the initial stages, it was crucial to grasp the diverse elements that could impact both architects' and non-architects' experiences. I meticulously outlined various concepts and transformed them into the 'spectrums and situations' framework.
Utilizing design principles and a framework for prioritizing content, I provided transparency into my decision-making process and rallied the team to embrace our shared vision.
Giving Users Back Their Time
The system needed to be flexible enough to generate renders for non-architect users. Don't design based on the assumption we will know the right answer.
A confidence score would determine whether to choose the similarity level as balanced on behalf of the user, or to disambiguate their preference. How we calculated this confidence score would be an ongoing project to improve.
We needed to respect user control on final result. Design patterns needed to allow for prompting, similarity level and visual identity.
Starting design process
My earliest design challenge was to propose how we would display content in the same interface for both architect/designer and non‐architect/designer customers.
I hypothesized that users' preferences for rendering might vary depending on their level of familiarity with architectural design software. Lacking qualitative data to support this assumption, I conducted a hierarchical card sort with eight participants. My goal was to gain insights into how users perceive various rendering parameters and what factors are most significant to them when using Archivinci.
During the think-aloud sessions, participants vocalized their thoughts while interacting with the product. It was interesting to find out that they prioritized rendering options based on how trustworthy and relevant they perceived the results to be. Additionally, participants also considered their level of curiosity and skepticism towards specific features when making their choices.
The findings underscored the significance of prioritizing specific design components, especially in access to rendering options. Observing that users frequently seek additional information about similarity levels and benefit from positive and negative prompts to grasp the limitations of AI, I incorporated these insights into the refinement of Archivinci's rendering parameters interface. Moreover, I ensured the prominence of render mode and render styles, recognizing their importance in providing users with clear and intuitive navigation through the platform.
We conducted an extensive survey to gain insights into how users engage with and select various rendering options. Our findings revealed that.
Millions of Render Alternatives in Seconds
Users prioritize similarity level and style when choosing rendering options, with consideration for the mood and purpose of the project.
Similarity level serves as a crucial filter for users to find renders that match their desired aesthetic or to include certain lines of the design.
There is a significant correlation between users' perceptions of similarity level and rendering styles. Drawing from these insights, I crafted the rendering selection interface in Archivinci to feature a single filter list. This design approach aims to streamline the decision-making process, alleviate cognitive load by eliminating the need to switch between different parameters, and enhance user navigation by providing a clear pathway to finding the desired render parameters.
After evaluating the core strengths of Archivinci, it became evident that aligning the platform with common architectural workflows would be beneficial. Our proposal was to streamline the rendering process, mirroring users' existing practices in architectural design software.
The next challenge involved ensuring smooth compatibility with various design tools and workflows used by our users.
Archivinci maintains exceptionally high standards for its output, both for similarity level and photo-realistic result. This values accountability, attention to detail, and encourages thorough review of work. As a result, there's a lot of documentation involved.
For every feature phase, I followed a structured process involving requirement gathering, consensus-building, obtaining approvals, creating detailed specifications, and facilitating handoffs.
My approach included brainstorming and mapping out concepts and workflows which were then translated into high-fidelity design compositions. Leveraging existing design patterns facilitated a seamless transition into high-fidelity designs.
DETAILED DESIGN
Communicating Design
.png)
This one button sparked intense debate within our team, with more time spent defending its design than actually addressing the underlying design challenge. The key points of contention revolved around:
What does the button say?
What does the button look like?
What does the button do when you click?
time to answer
To guide my design process, I utilized the Think, Do, Feel exercise from Gamestorming. However, instead of relying solely on observed behaviors, I worked backward from the desired aspirational thoughts, feelings, and actions.
After carefully evaluating various design explorations, I narrowed down the options to two competing concepts: orange button and dark grey with an arrow. To reach a final decision, I devised a plan for user testing to gather feedback and inform the ultimate choice.
The controversial orange button
insights from 16 participants
“…I felt confident in moving forward with the orange button because I knew it would lead me directly to the 'generate' page, aligning with my primary objective on the website.”
Users showed a positive response to the orange button.
Users want to clearly understand if they can start for free
Users’ instincts prompt them to click on the button when it's orange.
I designed the flow around the concept of a user confidence score. When Archivinci is confident about the users’ requests, it seamlessly proceeds with the task. However, if there's uncertainty, the app prompts the user to get their desired output.
Rather than aiming for a single direction, I crafted a flexible system that prioritizes adaptability and user choice, optimizing for providing various options.
To simplify the way we design for multiple screens, we will break our device set into two viewport size (regular and large) and density buckets.
our goal is to scale elements across devices for physical consistency. We have 2 main coloumns for the render generation part and a large background which covers the entire page.
We use the parameter selecting coloumn on side on desktop and tablet, while we use it on top for narrow mobile screens.
Multi-Device and Display Strategy
IMPLEMENTATION
.jpg)
.jpg)
Bringing It All To Life
One week before the launch, I focused even more on confirming our strongest beliefs. We extended our beta testing period and conducted Guerrilla user testing, which revealed the main risks in the product to be:
Testing My Assumptions
VALIDATION
The parameters must precisely convey the chosen style and texture.
1
Rendering time should be short and understandable
2
Playing around with renders and get inspriation
3
“After using Archivinci for 3 days I still feel that To get the exact same image as the one I uploaded, I need to make a lot of attempts. And because I have to wait 45 seconds for each render, reaching the correct result takes a lot of time…It’s hard to get.”
Interestingly, the themes we identified during this period were the same issues we found after the launch.
Many users commented that they wanted the lines of their uploaded images to match exactly and be entirely precise in the generated renders. They mentioned that they experimented until they captured the correct lines since the resulting images were random. They also complained about the significant time loss due to waiting approximately 45 seconds for each render during these trials. While the results were beautiful, for some users, getting the exact match of the uploaded image was more important.
As a result of our code optimization and deep fine-tuning of stable diffusion parameters, coupled with additional servers based on user count, the render production time was reduced to 11 seconds.
We also added selection buttons that allow users to adjust the similarity level of the renders, with the possibility for some users to achieve up to 98% similarity.
Parameters to detect desired output style
After the excitement of the launch settled down, we kept a close watch on what customers were saying. We knew there were some big problems with the product that needed fixing.
It wasn't surprising to see that the feedback after the launch was similar to what we found during testing before the launch. We’ve already started working on the solutions.
Luckily, now that the launch was over, we had the time and space to implement fixes properly.
Pulling the Trigger
THE EVOLUTION
I led a research strategy to understand the product's problems better and find ways to improve it.
For two weeks, we conducted a diary study and usability tests. We also tested ideas for the future.
To share what we learned from the research, I made a map showing the customer's journey.
This helped me show how serious the problems were and discuss what we needed to fix.
Strategy with Tactics
This research was a major breakthrough for our team and allowed us to focus our energy on creating the right experience, this time.
After another two weeks of design and development, we launched our first of many updates to Archivinci AI. Customers now have a premium area of the experience-where they can generate unlimited precise renders in 8 to 10 seconds.
We had finally created the desirable experience for our customers.
“We had finally created the desirable experience for our customers.”
My subsequent step involved segmenting the design compositions and assembling them into a prototype using Figma. Initially, I concentrated on representing the most critical areas of the design. As the project progressed, I focused on refining micro-interactions.
Prototyping served as the most effective method for gathering valuable feedback from the team, and securing approval. I could effortlessly share these prototypes as working links and recycle them for usability testing, ensuring continuous refinement of the product.
Adaptation - a flexible architecture
“We weren't expecting a 'yes' to our product, but we were aiming for a 'WOW' at first sight.”
We observed that customers had difficulty while waiting for each result. It was taking around 40 seconds to get results and during this process they would leave the page and forget about the renders. These issues were inextricably linked and compounding.
Waiting process is too long
On the morning of February 13, we began rolling‐out Archivinci AI for mobile and desktop. The launch proceeded flawlessly—an incredible accomplishment given the magnitude and intricacy of the deployment.
Rocket-like start
THE LAUNCH
.webp)
It’s still early days for the AI service, yet the results have exceeded our expectations. Since the launch of the updates on ArchiVinci AI, During the first two weeks, the user count was 10.000; after the updates, the daily user count increased to 76.000
The Rocket-like Start is Still Day One
THE IMPACT
“This tool is truly amazing. I've never been able to render so quickly with any other tool”
“It even considered the lines of the curtain in the image I uploaded, I can't believe it”
“How can a tool that provides both unlimited renders and the textures I want be available at this price?”
ArchiVinci AI
ux/ui design │ website│web app │generative AI integration
DropYourAI
ux/ui design │ website │ branding │ AI integration
Oscar Car Rental
new feature │ redesign website │ mobile app │ user testing
Furniture Shop App
ux/ui design │ mobille app │ AR/VR design │AR integration
see other
ux/ui projects
I prioritize simplicity, focus, and functionality. My goal is to create experiences that effortlessly enhance people's lives. Attention to detail and craftsmanship are paramount to me. I have a genuine appreciation for architecture and a desire to assist individuals in finding designs that resonate with them.
During the initial launch phase, I struggled to fully embrace the reality of our product. I was acutely aware of its flaws and shortcomings. I knew the solutions to various usability issues and recognized the absence of critical features. Moreover, I witnessed significant resources being allocated to non-essential features, compromising the performance and reliability of the core functionality.
My dissatisfaction stems not from perfectionism, but from a commitment to quality. I firmly believe that quality should never be sacrificed, even in the earliest stages of product development. Achieving excellence requires collective effort and a shared commitment to our core values.
Looking back, I acknowledge that my personal satisfaction and pursuit of quality may not have a direct impact on the product's success. Ultimately, the product's value lies in how it is utilized and the impact it has on users.