Hi, I am Lohith!

Product Designer

seasoned in end-to-end web design.

7 plus years of design at scale

Shipped 4 products in 6 months - ~3x my pre-AI pace.Built with DesignForge - a 6-phase AI + human methodology.

Lohith Savala, Product Designer
Recent work

Shipped. Not just designed.

Work That Speaks!

SAT LMS

End to end product creationLive

How I made a learning platform behave like a personalized tutor

I used diagnostic-first UX, prescribed paths, and next-action UI to turn scattered course material into a guided learning journey.

2.8xhigher continuation1.4xdeeper learning progress
View Case Study

S.P.A.R.K. Presenter

Product design and ArchitectureLIVE

How I built an assembly line for learning content - and made manual production obsolete

I built a component system and automation pipeline that turns raw course content into production-ready learning experiences in minutes.

100files processed in 2 hours95%+automated accuracy
View Case Study

e-GMAT Website

Web DesignLive

How I rebuilt the website to make product value easier to trust

I reorganized messaging, proof, and action paths so visitors could understand the offering faster and move forward with more confidence.

25%visitor return rate, up from 15%50%cart-to-purchase rate, up from 45%
View Case Study

Neuron

End-to-end product designLive

How I turned scattered GMAT practice into a focused workspace

I designed Neuron end-to-end - user flows, interactions, design system, and every screen - so learners could drill official questions in a structured flow instead of stitching practice together across platforms.

40%less time-to-first-question3.1xweak-area retest rate
View Case Study

Process: the engine behind the speed

Built with DesignForge

I had already seen the trap: when product logic, UX flow, UI polish, code, data, and production constraints are solved together, the work gets noisy.

So I split the build into layers: experience first, interface next, production last.

Step00
Make UX gaps visible earlyWrite rules, states, and flows before code
01
02
03
04
05
06
The Start
Input specification | Remedials
2-Remedials/|-- 00-README-remedials.md|-- 01-context-and-business-rules-remedials.md|-- 03-user-journey-map-remedials.md|-- 05-wireframes-remedials.md|-- 07-backend-specification-remedials.md`-- 08-frontend-success-criteria-remedials.md

Logical Priming

Before build, I wrote down the business rules, screens, journeys, component behavior, wireframes, screen flow, backend contracts, and success criteria. That made missing states and unclear handoffs visible before code could hide them.

What this prevented: AI inventing product logic mid-build.

The Start
Input specification | Remedials
2-Remedials/|-- 00-README-remedials.md|-- 01-context-and-business-rules-remedials.md|-- 03-user-journey-map-remedials.md|-- 05-wireframes-remedials.md|-- 07-backend-specification-remedials.md`-- 08-frontend-success-criteria-remedials.md

Logical Priming

Before build, I wrote down the business rules, screens, journeys, component behavior, wireframes, screen flow, backend contracts, and success criteria. That made missing states and unclear handoffs visible before code could hide them.

What this prevented: AI inventing product logic mid-build.

Experience First
Journey component mapping | Remedials
JourneyComponent flow
J1CF RemedialM1 -> R6 -> R1 -> R4 -> R3
J2Process Skill RemedialSame path, different trigger
J6Skipped RemedialR1 dismissed -> M2 pending
J7Course ReturnM3 -> M4 -> M6

Journey Planning

I converted the specification into a student journey and component dependency map, so the feature could be judged as a flow instead of isolated screens.

What this prevented: Screens that looked right alone but failed in sequence.

02-sandbox-requirement-remedials.md
---
## 8. Sandbox File Structure

pages/sandbox/remedials/
|-- PageHome.jsx                  # Copy, replace API with mock data
|-- PageHome.css                  # Copy
|-- ActivityPage.jsx              # Add remedial callback handling
|-- ActivityPage.css
|-- components/
|   |-- activity/
|   |   |-- ActivityPageShell.jsx
|   |   |-- ActivityPageShell.css
|   |   `-- index.js
|   |-- course/
|   |   |-- ActivityLineItem.jsx
|   |   |-- ActivityLineItem.css
|   |   |-- UnitBlock.jsx
|   |   `-- UnitBlock.css
`-- mock-data/remedials.js
## 9. Routing Setup

Add to `App.jsx`:

```
// Course home sandbox
<Route path="/sandbox/remedials/:courseCode" element={<RemedialsSandboxHome
/>} />

// Activity page sandbox
<Route path="/sandbox/remedials/:courseCode/activity/:activityId" element=
{<RemedialsSandboxActivity />} />

Sandbox Creation

I set up a disconnected sandbox with mock data and clean constraints so the product could be assembled, broken, tested, and improved away from production pressure.

What this prevented: Production constraints deciding the UX too early.

gap-analysis-summary-remedials.md

### Q4: How do R6 Notice and R1 Modal integrate with Activity Results?

Affected Components: R6 Notice, R1 Modal, M1 Results Screen

The Issue:

  • Spec shows R6 as a section within the results screen
  • R1 modal appears after clicking Continue on results
  • O0 decision says ActivityPage handles this via callback

Options:

OptionDescription
(A) ActivityPage wrapperActivityPage receives completion event, renders custom results wrapper with R6, then R1 modal
(B) Overlay approachLet spark-maximus show default results, then overlay R6/R1 on top
(C) Callback injectionPass a render callback to spark-maximus to inject R6 into results
backend-gap-analysis-remedials.md

### Fields Required in Remedial Children

FieldTypeRequiredDescriptionUsed For
contentIdnumberYesUnique ID of the remedialNavigation
contentTypestringYesMust be REMEDIALCard styling
contentNamestringYesDisplay nameCard title
correlationIdstringYesUUID for Neuron iframeLaunching remedial
estimatedDurationMinutesnumberYesExpected completion timeTime badge
progressStatusstringYesNOT_STARTED / INPROGRESS / COMPLETEDStatus badge
motherActivityNamestringCheckParent activity nameDescription copy

How Frontend Uses This

  1. Extract remedials from `activity.children` in the Next Up block
  2. Flatten them into the `contentItems` array
  3. Render each remedial immediately after its parent activity

System Rough Build

Inside the sandbox, I used a rough working build to find missing states, unclear interactions, weak hierarchy, and backend gaps before any visual polish started.

What this prevented: Polishing while core data contracts were still unclear.

Interface Next
component-renders-design-specification
AActivity SidebarQueue clarityBR2 Remedial RowHierarchy under mother activityCR6 NoticeDual placement

Design Iteration

Once the rough build exposed the real UX behavior, I moved into interface design and documented hierarchy, states, and treatment through distinct design options.

What this prevented: Pretty UI detached from behavior.

PR4 - Sandbox Integration.md
Sandbox integration/|-- Task P3.1 - R2 integration.md|-- Task P3.2 - M2 UI update.md`-- Task P3.3 - R6 integration.md

Sandbox Integration

I dropped the polished components back into the sandbox and tested them as one complete flow, so polish had to survive the journey end to end.

What this prevented: Polished components that failed together.

Production Last
prod-migration-map.md
R1RemedialCreatedModalsrc/components/remedials/
R3CompletionFeedbacksrc/components/remedials/
R6ResultsNoticesrc/components/remedials/
AuditToken deviation reportrelease-ready

Production Migration

With the full flow validated, I moved to production with migration notes, system checks, backend contracts, and token-deviation reports, so intent did not get flattened in handoff.

What this prevented: Product logic and design intent getting lost in production migration.

DesignForge contrast

Why this framework worked?

  • The spec carried the logic.

  • The journey carried the flow.

  • The rough build exposed the UX.

Each step narrowed the next one.

Beyond the headline work.

The Full Range!

Product systems, web builds, and brand collateral - the wider body of work behind how I think, design, and ship.

Product SystemsProduct Design7+ tools & systemsShaping messy product logic into clear decisions, usable flows, and shipped interfaces.
Web ServicesWeb Design & Build150+ pages builtMarketing sites, landing pages, blogs, explainers, and conversion journeys built end to end.
Visual SystemsMarketing & BrandingCampaigns, logos & video collateralCampaign, logo, and content systems built for visual recall.

Product Systems

Product Design

7+ tools & systems

Shaping messy product logic into clear decisions, usable flows, and shipped interfaces.

Planning systemPersonalized Study PlannerTurns target score, current ability, and weekly hours into a day-by-day GMAT prep path that re-plans when life happens.
Internal productSIGma-XComplex capability translated into a usable operating interface.
Practice & analyticsScholaraniumA ground-up rebuild of e-GMAT's highest-traffic practice platform — turning every attempt into actionable insight on what to fix next.
Behavior loopStudy Streak RingsMotivation mechanics designed around consistency and return behavior.
Planning systemPersonalized Study PlannerTurns target score, current ability, and weekly hours into a day-by-day GMAT prep path that re-plans when life happens.
Internal productSIGma-XComplex capability translated into a usable operating interface.
Practice & analyticsScholaraniumA ground-up rebuild of e-GMAT's highest-traffic practice platform — turning every attempt into actionable insight on what to fix next.
Behavior loopStudy Streak RingsMotivation mechanics designed around consistency and return behavior.
Planning systemPersonalized Study PlannerTurns target score, current ability, and weekly hours into a day-by-day GMAT prep path that re-plans when life happens.
Internal productSIGma-XComplex capability translated into a usable operating interface.
Practice & analyticsScholaraniumA ground-up rebuild of e-GMAT's highest-traffic practice platform — turning every attempt into actionable insight on what to fix next.
Behavior loopStudy Streak RingsMotivation mechanics designed around consistency and return behavior.

Web Services

Web Design & Build

150+ pages built

Marketing sites, landing pages, blogs, explainers, and conversion journeys built end to end.

SEO content systeme-GMAT Blogs — one system, 150+ pagesOne WordPress theme made to behave like a system, so page 150 stays as on-brand as page 1.
Agency landing pageNerdyPixel — the work as the pitchThe studio's own site, built to prove a small team ships real outcomes and to qualify leads before the first call.
Conversion pageFree Trial — the outcome, up frontAnchored on one outcome (735+), with verifiable proof and a CTA in every block, so signing up is the easy path.
Sales page + appCoach Connect — sell it, then serve itTwo surfaces for one subscription: a page that persuades, and an app where members live day to day.
Marketing page systemGrowth Pages — one system, many pagesProduct, proof, session and careers pages on one visual system, tuned to each page's job in the funnel.
SEO content systeme-GMAT Blogs — one system, 150+ pagesOne WordPress theme made to behave like a system, so page 150 stays as on-brand as page 1.
Agency landing pageNerdyPixel — the work as the pitchThe studio's own site, built to prove a small team ships real outcomes and to qualify leads before the first call.
Conversion pageFree Trial — the outcome, up frontAnchored on one outcome (735+), with verifiable proof and a CTA in every block, so signing up is the easy path.
Sales page + appCoach Connect — sell it, then serve itTwo surfaces for one subscription: a page that persuades, and an app where members live day to day.
Marketing page systemGrowth Pages — one system, many pagesProduct, proof, session and careers pages on one visual system, tuned to each page's job in the funnel.
SEO content systeme-GMAT Blogs — one system, 150+ pagesOne WordPress theme made to behave like a system, so page 150 stays as on-brand as page 1.
Agency landing pageNerdyPixel — the work as the pitchThe studio's own site, built to prove a small team ships real outcomes and to qualify leads before the first call.
Conversion pageFree Trial — the outcome, up frontAnchored on one outcome (735+), with verifiable proof and a CTA in every block, so signing up is the easy path.
Sales page + appCoach Connect — sell it, then serve itTwo surfaces for one subscription: a page that persuades, and an app where members live day to day.
Marketing page systemGrowth Pages — one system, many pagesProduct, proof, session and careers pages on one visual system, tuned to each page's job in the funnel.

Visual Systems

Marketing & Branding

Campaigns, logos & video collateral

Campaign, logo, and content systems built for visual recall.

Campaign identityEncubateA freelance campaign system for an entrepreneurship platform — one brand, four campaigns, each tuned to a different moment in the funnel.
Conversion collaterale-GMAT Sales DealsA visual-strategy revamp of e-GMAT's sales collateral — from generic stock photos to a system built on real student proof.
Brand marksLogo DesignIdentity explorations for brands, initiatives, and internal products.
Video design opsYouTube Growth SystemThumbnail, shorts, community, and publishing systems for consistency.
Story collateralStudent Success CreativesVisual systems for turning outcomes into credible proof.
Conversion collateralWebinar CampaignsEvent visuals, promotion assets, and funnel-support creatives.
Attention designSocial CreativesFast-turnaround assets built for scanning, recall, and action.
Campaign identityEncubateA freelance campaign system for an entrepreneurship platform — one brand, four campaigns, each tuned to a different moment in the funnel.
Conversion collaterale-GMAT Sales DealsA visual-strategy revamp of e-GMAT's sales collateral — from generic stock photos to a system built on real student proof.
Brand marksLogo DesignIdentity explorations for brands, initiatives, and internal products.
Video design opsYouTube Growth SystemThumbnail, shorts, community, and publishing systems for consistency.
Story collateralStudent Success CreativesVisual systems for turning outcomes into credible proof.
Conversion collateralWebinar CampaignsEvent visuals, promotion assets, and funnel-support creatives.
Attention designSocial CreativesFast-turnaround assets built for scanning, recall, and action.
Campaign identityEncubateA freelance campaign system for an entrepreneurship platform — one brand, four campaigns, each tuned to a different moment in the funnel.
Conversion collaterale-GMAT Sales DealsA visual-strategy revamp of e-GMAT's sales collateral — from generic stock photos to a system built on real student proof.
Brand marksLogo DesignIdentity explorations for brands, initiatives, and internal products.
Video design opsYouTube Growth SystemThumbnail, shorts, community, and publishing systems for consistency.
Story collateralStudent Success CreativesVisual systems for turning outcomes into credible proof.
Conversion collateralWebinar CampaignsEvent visuals, promotion assets, and funnel-support creatives.
Attention designSocial CreativesFast-turnaround assets built for scanning, recall, and action.

Precision and Creativity

The Full Toolkit!

Five disciplines I work across, and the kit that earns its place under each. Hover a circle — the rest will follow.

FigmaXDFront-end engineeringPythonSeleniumSQL*API Integration*WebflowLovableUnbounceHTML/CSSReact*Claude CodeClaude.aiFigma AIOpenAI CodexReplit*PhotoshopIllustratorCanvaPremiere Pro*CamtasiaStoryline 360Rise 360PowerPointAdobe Connect
*Logos are properties of respective companies
* Learning

What they say?

Echoes of Impact!

Design is collaborative. From mentors to teammates, words that remind me — "I've made an impact!"

Atul Kumar

Atul Kumar

Chief Product Architect, Career Launcher

Former COO, e-GMAT · Mentor

- He is a Relentless Builder

“Lohith was relentless in the best way. I watched him grow from someone I hired and mentored into the face of design at eGMAT. Once he sets his sights on something, he does not rest until it is finished.”

Sundeep Eddu

Sundeep Eddu

Head of Marketing & Sales, e-GMAT

Public website redesign partner

- He is an End-to-End Owner

“Lohith did not just design the public website — he owned the content, structure, and production end to end. We shipped faster and cleaner than any project of that scale, and his decisions still show in every section.”

He is a Relentless Builder

“Lohith was relentless in the best way. I watched him grow from someone I hired and mentored into the face of design at eGMAT. Once he sets his sights on something, he does not rest until it is finished.”

Atul Kumar

Atul Kumar

Chief Product Architect, Career Launcher