Logo

Portfolio

About

Contact

View Resume

Logo
Logo

Portfolio

About

Contact

View Resume

Iosta Design Studio · Industry Project · Architecture & Interior Design

Crafting Iosta's Digital Identity through End-to-end Website Design & Development

Tools

Figma, Wix, Mural, Pen & Paper

Team

1 UX Designer & Developer (Me)

Stakeholders

2 Co-founders

Duration

1 Year (Part-time)

Responsive Design Mockup for Iosta's Website on Laptop & Phone
Responsive Design Mockup for Iosta's Website on Laptop & Phone
Responsive Design Mockup for Iosta's Website on Laptop & Phone

Project Overview

Iosta Design Studio, an early-stage interior design startup, sought to expand its online presence to attract a national audience and grow its clientele.

The Challenge?

“As a new player in a competitive interior design market with limited projects to showcase, Iosta needed to establish an online presence that projected credibility and professionalism while standing out from established competitors.”

“As a new player in a competitive interior design market with limited projects to showcase, Iosta needed to establish an online presence that projected credibility and professionalism while standing out from established competitors.”

“As a new player in a competitive interior design market with limited projects to showcase, Iosta needed to establish an online presence that projected credibility and professionalism while standing out from established competitors.”

My Role

As the sole UX designer and developer, I led the project end-to-end — aligning business goals with user needs, designing a competitive online presence, and handling both design and technical implementation.

Key Outcomes

Enhanced Usability, Improved Organic Search, Increased Return Visitor Rate

Link to Final Product

Note: Screenshots used in this case study are solely for illustrative and educational purposes. All rights to the original designs and content belong to their respective owners.

My Design Process

Market Research

User Needs & Gaps in Competitor Websites. Key Content & Features to stand out in the Industry.

Market Research

User Needs & Gaps in Competitor Websites. Key Content & Features to stand out in the Industry.

Information Architecture

Iterative Sitemaps. Intuitive Structure to balance User & Business Needs.

Information Architecture

Iterative Sitemaps. Intuitive Structure to balance User & Business Needs.

Wireframing

Low & High-fidelity Wireframes for Desktop & Mobile. Experimenting Layouts, Typography, and Colour Palettes.

Wireframing

Low & High-fidelity Wireframes for Desktop & Mobile. Experimenting Layouts, Typography, and Colour Palettes.

Website Development

Built & Launched the website using Wix. Responsiveness & Seamless User Experience across Devices.

Website Development

Built & Launched the website using Wix. Responsiveness & Seamless User Experience across Devices.

My Design Process

Market Research

User Needs & Gaps in Competitor Websites. Key Content & Features to stand out in the Industry.

Information Architecture

Iterative Sitemaps. Intuitive Structure to balance User & Business Needs.

Wireframing

Low & High-fidelity Wireframes for Desktop & Mobile. Experimenting Layouts, Typography, and Colour Palettes.

Website Development

Built & Launched the website using Wix. Responsiveness & Seamless User Experience across Devices.

Insights from Research

To uncover opportunities for differentiation, I analysed the websites of 10 competitors across small and large firms. Key findings included:

An Existing architecture website with cluttered layout, difficult to read text, and unnecessary graphics.
An Existing architecture website with cluttered layout, difficult to read text, and unnecessary graphics.

Cluttered Layouts: Overwhelming users with unnecessary and excessive information.

An existing architecture website asking user information before allowing them to browse the website.
An existing architecture website asking user information before allowing them to browse the website.

Weak Trust Signals: Lack of proper trust-building before call-to-action (CTA).

An existing architecture website with navigation and menu items hidden behind images, making them difficult to view.
An existing architecture website with navigation and menu items hidden behind images, making them difficult to view.

Unclear Menus & Page Navigation: Poorly designed menus and unclear page hierarchy.

An existing architecture website with a large set of visuals, not sharing information about the company.
An existing architecture website with a large set of visuals, not sharing information about the company.

Over-reliance on Visuals: Using large images without meaningful context.

Insights from Research

To uncover opportunities for differentiation, I analysed the websites of 10 competitors across small and large firms. Key findings included:

An Existing architecture website with cluttered layout, difficult to read text, and unnecessary graphics.

Cluttered Layouts: Overwhelming users with unnecessary and excessive information.

An existing architecture website asking user information before allowing them to browse the website.

Weak Trust Signals: Lack of proper trust-building before call-to-action (CTA).

An existing architecture website with navigation and menu items hidden behind images, making them difficult to view.

Unclear Menus & Page Navigation: Poorly designed menus and unclear page hierarchy.

An existing architecture website with a large set of visuals, not sharing information about the company.

Over-reliance on Visuals: Using large images without meaningful context.

Streamlining Information Architecture

Final Sitemap of the website showing a simplified information architecture
Final Sitemap of the website showing a simplified information architecture
Final Sitemap of the website showing a simplified information architecture

✅ Designed and refined multiple sitemap iterations to ensure intuitive navigation.

✅ Focused on showcasing concise and user-relevant content.

✅ Removed redundant and unnecessary information, keeping the website clean and easy to understand.

See the iterative process below.

Sitemap iterations of the information architecture showcasing the process
Sitemap iterations of the information architecture showcasing the process
Sitemap iterations of the information architecture showcasing the process

A Contextualized Portfolio

Each project includes a brief 1-2 sentence overview to provide context about the work, giving potential clients a glimpse into the studio’s design approach and expertise.

Experimentation with Different Layouts

Option 1 showcasing 2 pages - 1 with the list of projects and a salideshow; the other with details of a project.
Option 1 showcasing 2 pages - 1 with the list of projects and a salideshow; the other with details of a project.
Option 1 showcasing 2 pages - 1 with the list of projects and a salideshow; the other with details of a project.

Layout 1: Separate pages showcasing the project list and details, adding more structure to the layout.

Layout 1: Separate pages showcasing the project list and details, adding more structure to the layout.

Option 2 showcasing 1 page with a project selector slideshow on the top and details of each project below.
Option 2 showcasing 1 page with a project selector slideshow on the top and details of each project below.
Option 2 showcasing 1 page with a project selector slideshow on the top and details of each project below.

Layout 2: A single page with both the project gallery and the details, reducing the number of clicks.

Layout 2: A single page with both the project gallery and the details, reducing the number of clicks.

Final Refined Layout after Multiple Wireframing Iterations

Settled on a list + gallery layout: a concise list of all projects combined with a clean visual gallery, minimizing user effort to explore the portfolio.

Desktop Mockup GIF for Portfolio
Desktop Mockup GIF for Portfolio
Desktop Mockup GIF for Portfolio
Mobile Mockup GIF for Portfolio
Mobile Mockup GIF for Portfolio
Mobile Mockup GIF for Portfolio

Additional Contributions

Desktop Mockup showcasing general hierarchy and design for the website.
Desktop Mockup showcasing general hierarchy and design for the website.

Prioritized Clarity & Accessibility

Balanced white space, clear visual hierarchy, and readable typography.

Desktop Mockup showcasing the About page of the website.
Desktop Mockup showcasing the About page of the website.

Built Credibility with Audience

Introduced sections on the company ethos and the founders before presenting a CTA.

Custom Illustration & Icons

Designed unique visual assets aligned with the studio's branding to enhance website aesthetics.

Responsive Design

Ensured consistent performance across all screen sizes for a smooth user experience.

Bridging Technical Gaps

Assisted in navigating technical challengeslike hosting setup & domain management for a seamless launch.

Additional Contributions

Desktop Mockup showcasing general hierarchy and design for the website.

Prioritized Clarity & Accessibility

Balanced white space, clear visual hierarchy, and readable typography.

Desktop Mockup showcasing the About page of the website.

Built Credibility with Audience

Introduced sections on the company ethos and the founders before presenting a CTA.

Custom Illustration & Icons

Designed unique visual assets aligned with the studio's branding to enhance website aesthetics.

Responsive Design

Ensured consistent performance across all screen sizes for a smooth user experience.

Bridging Technical Gaps

Assisted in navigating technical challengeslike hosting setup & domain management for a seamless launch.

Why It Works?

Professionalism & Trust

A clear and user-centred information architecture highlights the studio’s professionalism, making it easier for users to trust the brand.

Professionalism & Trust

A clear and user-centred information architecture highlights the studio’s professionalism, making it easier for users to trust the brand.

Streamlined Navigation

Reducing unnecessary clicks and simplifying the user journey ensures effortless browsing, leading to a smoother experience.

Streamlined Navigation

Reducing unnecessary clicks and simplifying the user journey ensures effortless browsing, leading to a smoother experience.

Clarity & Relatibility

Contextual descriptions complement the visual portfolio, creating a more engaging and relatable experience for users.

Clarity & Relatibility

Contextual descriptions complement the visual portfolio, creating a more engaging and relatable experience for users.

Quick Information Access

A well-organized layout allows users to easily find relevant details, fostering confidence in the studio’s services.

Quick Information Access

A well-organized layout allows users to easily find relevant details, fostering confidence in the studio’s services.

Why It Works?

Professionalism & Trust

A clear and user-centred information architecture highlights the studio’s professionalism, making it easier for users to trust the brand.

Streamlined Navigation

Reducing unnecessary clicks and simplifying the user journey ensures effortless browsing, leading to a smoother experience.

Clarity & Relatibility

Contextual descriptions complement the visual portfolio, creating a more engaging and relatable experience for users.

Quick Information Access

A well-organized layout allows users to easily find relevant details, fostering confidence in the studio’s services.

Impact & Personal Reflections

Current Metrics & What It Means?

Bounce Rate

Achieved a bounce rate of 40% in the initial month, which is better than 89% of competitors.

Suggests users explore beyond the landing page, validating intuitive navigation.

Organic Search Traffic

Improved from 18% to 53%, currently better than only 80% of competitors.

Demonstrates improved discoverability after SEO Optimization.

Return Visitor Rate

Increased the return visitor rate to 11%, exceeding 62% of global competitors.

Highlights a potential need for enhancing user engagement - comprehensive usability testing required for better understanding.

Planned Metrics

Client Contact Rate

How many users initiated contact after visiting the website?

Client Conversion Rate

How many visitors converted into potential or existing clients?

Customer Reach

How far has the company’s clientele expanded due to the website?

Personal Learnings

Design Leadership

Leading the project end-to-end strengthened my ability to manage full-cycle UX projects and align design decisions with business goals.

Design Leadership

Leading the project end-to-end strengthened my ability to manage full-cycle UX projects and align design decisions with business goals.

Design Leadership

Leading the project end-to-end strengthened my ability to manage full-cycle UX projects and align design decisions with business goals.

Technical Integration

Overcoming technical challenges during implementation, like DNS setup & domain allocation, taught me how to bridge design and development efficiently.

Technical Integration

Overcoming technical challenges during implementation, like DNS setup & domain allocation, taught me how to bridge design and development efficiently.

Technical Integration

Overcoming technical challenges during implementation, like DNS setup & domain allocation, taught me how to bridge design and development efficiently.

Cross-disciplinary Collaboration

Collaborating with interior design professionals broadened my perspective on aesthetics and functionality, deepening my appreciation for visual storytelling.

Cross-disciplinary Collaboration

Collaborating with interior design professionals broadened my perspective on aesthetics and functionality, deepening my appreciation for visual storytelling.

Cross-disciplinary Collaboration

Collaborating with interior design professionals broadened my perspective on aesthetics and functionality, deepening my appreciation for visual storytelling.

Next Steps

Usability Testing

Conduct usability tests with target users to gather feedback on navigation, accessibility, and overall experience.

Usability Testing

Conduct usability tests with target users to gather feedback on navigation, accessibility, and overall experience.

Dynamic Portfolio Update

As new projects are completed, add filters and categorisation features to maintain the portfolio’s clarity and scalability.

Dynamic Portfolio Update

As new projects are completed, add filters and categorisation features to maintain the portfolio’s clarity and scalability.

Performance Metrics

Regularly track key metrics like bounce rate, session duration, and conversions to refine the website further.

Performance Metrics

Regularly track key metrics like bounce rate, session duration, and conversions to refine the website further.

Next Steps

Usability Testing

Conduct usability tests with target users to gather feedback on navigation, accessibility, and overall experience.

Dynamic Portfolio Update

As new projects are completed, add filters and categorisation features to maintain the portfolio’s clarity and scalability.

Performance Metrics

Regularly track key metrics like bounce rate, session duration, and conversions to refine the website further.

Other Relevant Work

If you love design, solving messy problems, or meaningful conversations — I’d love to hear from you.

Email Me

Connect on LinkedIn

Designed to delight, built to last – Tanuj Aggarwal © 2025. All Rights Reserved.

If you love design, solving messy problems, or meaningful conversations — I’d love to hear from you.

Designed to delight, built to last – Tanuj Aggarwal © 2025. All Rights Reserved.

If you love design, solving messy problems, or meaningful conversations — I’d love to hear from you.

Email Me

Connect on LinkedIn

Designed to delight, built to last – Tanuj Aggarwal © 2025. All Rights Reserved.