top of page

Building ConSoul’s Digital Presence: Leading Strategy, Collaboration, and Execution from Vision to Launch.

A leadership-led design story - from hiring a cross-functional team to defining direction, structure, and delivery for a MarTech brand’s first semi-dynamic website.

mockup of home page.png

Background & Context : Setting the Scene

When ConSoul Solutions approached me, they didn’t have a website.
They were a growing Martech company specializing in customer retention, but they lacked an online presence that reflected their credibility, capability, and values.

Their immediate ask was clear: "We need a website.”

 

But through my early conversations with the founders, I realised the problem was much deeper–they didn’t just need a website; they needed a digital identity that could build trust, communicate their story, and position them as a strategic partner to CMOs and CEOs in the MarTech space.

 

This project wasn’t just about visuals. It was about establishing presence, shaping perception, and enabling growth.

​​​​​

Discovery : Talking to People and Defining the Problem

Before moving into design, I spent the first few weeks in conversation mode. I knew that the right solution would only emerge from the right questions.

​I began speaking with:

  • The founder and co-founder of ConSoul, to understand their long-term goals, target audience, and differentiators. 

  • Two of their existing clients, to learn how they discovered similar agencies, what they valued in a Martech partner, and what built trust for them.

  • senior MarTech consultant, who helped me understand how decision-makers (CMOs, CXOs, marketing heads) assess vendors and what kind of digital presence inspires confidence.

Some of the questions I asked included: 

  • What first impression do you want a client to have when they land on your site?

  • What do you think differentiates you from other Martech firms?

  • If your site could communicate only three messages, what would they be?

  • What information do your clients usually look for before reaching out?

In the initial discussions, we also discussed what were the technical expectations from the website:

  • A custom-made or builder website

  • Static, dynamic or semi-dynamic

  • Which sections did they want to be dynamic and why

  • Any other preferences they had with respect to how the interface (asked to share references)

These conversations revealed an important truth:

'ConSoul website wasn't meant to sell, it was meant to build belief.' 

​​​​​​​

ConSoul Solutions - Discussions.png

I scheduled a call with them to dive deep into understanding what they think this website will solve for them and why. By the end of our 1.5-hour call, I had a clear sense of:

  • Why they wanted a website in the first place,

  • Who they were building it for,

  • What a "new-age website" meant for them (phrase they emphasised multiple times in our first two phone calls), and

  • What they saw as the key parameters or selling points for their visitors.

ConSoul Solutions - red.png

Locking in on the initial requirements:

Before hiring a team, I wanted to fully understand the requirements and make sure the client and I were aligned. So, I created shared this document with them.

Once I got their go-ahead, I spoke to a few developers in my network to understand:

  • Whether it was feasible to build a a semi-dynamic website that’s SEO-enabled and visually immersive?

  • How much time it would take to code?

  • The cost of developing a semi-dynamic or mildly immersive site, and

  • If there were any additional costs involved in achieving this?

Team Formation & Collaboration : Building a Cross-Functional Core

By now I had locked in on the content writer and a developer. I was now looking for a technical expert who would guide us in the right direction while creating the content of the website. 

I hired and led a small but sharp team:

  • A full-stack developer who could build a semi-dynamic, SEO-optimised website.

  • A UX writer who understood the tone and vocabulary of digital marketing.

  • A digital marketing expert for SEO and analytics integration.

  • A senior Martech advisor to guide us toward positioning the site correctly for executive-level decision-makers.
     

On-boarding UX writer and getting on with 1st phase discussions:

I made sure to onboard a UX writer early in the process because content was the most crucial part of this project.

Once Rimjhim, the UX writer, joined in, we began regular discussions to deeply understand the client’s expectations.

 

We studied the references they had shared, did brainstorming sessions where we broke down each site to understand their flow, and how they used content hierarchy to tell their story.

ConSoul Solutions - Content discussions.png

Early discussions with the developer

 

After speaking with several developers in my network, I decided to hire Rishabh, a full-stack developer who I had earlier worked with on a small project. Once he was onboarded, we discussed possible interactions for the website, limitations around certain types of design components, and how we could build dynamic pages that would still be easy for the client to manage.

We first had an in-depth discussion within our internal team, followed by one with client, to ensure everyone was on the same page. 

How I simplified UI implementation for the developer

I wanted to prevent any friction between designing and coding; which led me to explore free UI libraries that came with pre-written codes for the interactive UI components. This gave me the freedom to design engaging and immersive interactions without giving the developer a headache.

Although I wanted to come to this part later, I had to lock-in on the visual treatment so we could define the scope for the developer. 

Research & Strategy : Turning Conversations into Structure

The next step was to transform our learnings into a strategic blueprint. I synthesised all interview and research data into clusters on Figjam for mapping goals, user needs, and brand values.

From this synthesis emerged three guiding principles:

  1. The right keywords are game changers - We learned that in the world of marketing technology, certain keywords instantly resonate with people.  

  2. Proof drives conversion - People love to see the impacts they have created for others before putting their trust in a new company. 

  3. Problem diagnosis and custom solution - Many companies are stuck at points they don’t fully recognise.

 

Our strategy throughout the website was to incorporate these three principles through content and design. 

ConSoul Solutions - breakdown1.png

Website breakdowns with the UX writer:

​​

The UX writer and I spent some time doing a really interesting exercise — we broke down a bunch of websites to see how they structured their homepages.

This helped us shape our own narrative flow for ConSoul’s website. We wanted to make sure the story we’re telling feels familiar to people who are already looking for a mar-tech partner. It ties back to Nielsen’s second heuristic–the match between system and the real world.

In simple terms, we wanted visitors to land on our site and immediately feel, “Okay, these people get it. They understand my world.”

 

How we Planned ConSoul's Case Studies' Flow on the Homepage:

We devised a crisp format which would tell the impact-oriented story in just one quick glance. Why? to save time. 

 

  • A headline that sums up the problem, solution, and impact in one clear line

  • A short subtext to add context and connect with the reader

  • Three key impact points that highlight what ConSoul achieved for that client

  • Two CTAs - one to read the full case study and another to directly book a call with us

IMG_0684_edited.jpg

How we Planned ConSoul's Case Studies' Flow on the Homepage:

We devised a crisp format which would tell the impact-oriented story in just one quick glance. Why? to save time. 

 

  • A headline that sums up the problem, solution, and impact in one clear line

  • A short subtext to add context and connect with the reader

  • Three key impact points that highlight what ConSoul achieved for that client

  • Two CTAs - one to read the full case study and another to directly book a call with us

Design & Execution : Leading Through Collaboration

With structure in place, I moved to design, but this phase wasn’t just about pixels; it was about alignment.

I started by defining a visual direction that reflected ConSoul’s brand–intelligent, confident, and understated.

 

To achieve this, I focused on:

  • Clean typography and generous whitespace for readability.

  • Subtle scroll-based animations for engagement.

  • Modular grids for scalability.

  • Brand colors used strategically to highlight key messages.

Throughout design, I shared early drafts in Figma and hosted live review sessions with the writer and developer. Instead of presenting finished designs, I invited them into the process–to co-own decisions.

One memorable moment: our developer pointed out that a planned animation could slow down page load time. We brainstormed alternatives on call, and within 15 minutes, found a CSS-based solution that achieved the same visual effect without compromising performance.

Link to early stage visual treatment drafts

<<add screenshot of figma files with multiple difference iterations of visual treatment and add link in the caption to go to file and check the designs>>

Project Management & UI Design: Navigating Scope & Deadlines Collaboration

As the project progressed, new requirements emerged:

  • a dynamic blog filter section

  • a free resources library for multiple pages, and

  • 2 new 'Services' pages

To handle these shifts, I established a modular design system early on. This allowed us to add or adjust features without disrupting the core structure.

 

I managed the project timeline using Notion, creating a clear view of dependencies between content, design, and development. Each Friday, I sent a short project summary to the team and the client — listing completed milestones, upcoming goals, and any blockers.

When the deadline tightened due to an upcoming client event, I reprioritized deliverables — focusing on high-impact pages first while scheduling phase two for post-launch optimization

<<add screenshots of Notion timelines , design system created, dynamic blog page - screenshot of the backend of the website's blog page and how it was dynamic, screenshot of one project summary>>

Homepage UI

1st Fold - Hero section

Our main copy focused on the flagship service that ConSoul delivers, which is 'Customer Retention'. It is then proceeded by a supporting line of how they achieve the result, concluded with 3 key takeaways for their clients. 

The moving visual on the right shows mock-ups of front and back-end of how things work, customer communication, overall benefit of having Consoul on board. 

Hero.png

2nd Fold - Services

This section was designed to tell a clear story of how ConSoul works—starting with data-driven strategy, followed by evaluating and aligning the client's MarTech tools, and finally executing and optimising campaigns.

We broke this down into three visually distinct panels, each highlighting the services under that phase with simple, benefit-led headlines, engaging visuals, and relatable copy.
 
The tone was kept accessible yet professional, and the flow helps users understand the full journey at a glance. We ended with dual CTAs to guide both curious and ready-to-act users.

Services.png

View prototype here: 

3rd Fold - A Dynamic Free Resources Section to Help Generate Leads

We designed this dynamic section to serve as a value-driven lead generation tool. It highlights free, in-depth content pieces (like articles, guides, or templates) that ConSoul can easily update or replace from the backend as per their campaign or content strategy.

To access the resource, visitors are prompted to enter their basic details—turning each download into a qualified lead for ConSoul.

This approach not only adds educational value for users but also supports ConSoul’s marketing goals by consistently capturing new prospects through gated, high-value content.

4th Fold - Social Proof (Testimonials & Clientele)

testimonials.png

5th Fold - Trust Building & Lead Generation

This section was designed to address two key objectives: build trust and capture leads. The “Why Choose Us?” block highlights ConSoul’s key differentiators in a quick-scan format—reinforcing their value proposition with clear, benefit-focused points.

Below it, we created a personalised lead capture form that feels more like a conversation than a form. It introduces the founder, Vani Garg, to build a personal connection and assure visitors of hands-on leadership involvement.

The form is tailored to collect relevant lead data while giving visitors the option to indicate their areas of interest—making it easier for the ConSoul team to follow up with contextual solutions.

Section 9 - why choose us.png

6th Fold -  More Trust Building Through Success Stories 

Section 5 - Success story 1.png

7th and Final Fold -  Existing Tech Stack and a Final Nudge at The End

Tech stack - Tools worked on:

This section was designed to visually showcase the breadth of ConSoul’s Martech expertise. Featuring a curated set of recognizable tool logos, it assures potential clients that ConSoul is platform-agnostic and well-versed in industry-standard technologies. We kept the layout clean and easy to scan, reinforcing trust through familiarity while subtly communicating capability and flexibility.
 

Final Nudge - Are you ready to...?

Positioned as the final nudge, this call-to-action section is designed to convert interest into engagement. With a clear, motivating question and dual CTAs—one for those ready to talk and another for those still exploring—it ensures that visitors at different stages of the decision-making journey feel catered to. The tone is warm yet direct, making the transition from browsing to taking action feel seamless.

Section 10 - partners.png

7th and Final Fold -  Existing Tech Stack and a Final Nudge at The End

Footer - desktop.png

Other Pages UI

Services Page

For the sake of brevity, the case study will only showcase the first page of the service section (Media & OTT) - You may check the entire service section here: <<add figma link>>

Other Pages UI

About Us

Other Pages UI

Careers - Dynamic Page

Feedback, Refinement & Adaptation

We conducted feedback sessions at two key points:

  1. After the prototype was ready

  2. During staging before go-live

The founders wanted a few sections to be more marketing-driven, while our research showed that C-suite visitors preferred clarity over persuasion.


I facilitated a joint discussion — balancing brand aspiration with user psychology. We rewrote the hero headline and refined the CTA placement to serve both. What you see in the designs were a result of the final  that is also tested with users. 

Instead of reacting to feedback defensively, I treated it as a dialogue – a way to align everyone on what the site should make people feel.

Outcome & Impact ​

The final website launched with all the intended semi-dynamic sections, SEO integration, and analytics tracking.

For ConSoul, it became more than just a website — it became their first true digital handshake. With a credible online presence, they could now confidently share their website with clients and partners, replacing the static PDF decks they once relied on. The new experience reflected their expertise, strengthened client trust, and positioned them as a serious Martech contender.

For me, this project was a defining moment in my design leadership journey. It reinforced that great design leadership isn’t about doing everything yourself — it’s about bringing clarity, alignment, and momentum to a team.

You have reached the end of this case study

Hi, I am Pragya Gupta – a Deep UX Generalist 
designing end-to-end FinTech and MarTech products.

E-mail : reachpragyagupta@gmail.com

Phone : +91 98200 07753

Location : Gurugram (Delhi NCR), India

bottom of page