Before you write your first component in JDP, there’s one quiet decision that shapes everything that follows.
Not React hooks.
Not state management.
Not even theming.
It’s the floorplan.
And if you get it right, your UI feels effortless.
If you get it wrong… you’ll spend the rest of the sprint fighting alignment issues and wondering why nothing feels “right.”
Let’s talk about floorplans in plain English.
So, what is a Floorplan in JDP?
A floorplan defines the structural layout of a page, before content comes into play.
It decides:
- where the header lives
- whether navigation exists (left, right, or none)
- where the content goes
- how side panels behave
- how the page responds across devices
Think of it like the blueprint of a building.
You don’t decide where the sofa goes before deciding how many rooms the house has.
JDP works the same way.
Why Floorplans Exist (The Real Reason)
Insurance apps are not simple landing pages.
They are:
- data-heavy
- navigation-heavy
- form-heavy
- multi-role (agent, customer, admin)
- expected to scale across dozens or hundreds of screens
If every page decided its own layout freely, chaos would be guaranteed.
So JDP flips the approach:
“Pick the structure first. Then build inside it.”
Floorplans enforce consistency without killing flexibility, which is exactly what large enterprise apps need.
The Common Floorplan Shapes
JDP floorplans usually come in a few familiar shapes:
I-shape
Header only.
Clean. Focused.
Perfect for simple pages, summaries, or standalone flows.
L-shape
Header + left navigation.
This is the classic enterprise layout.
Great for dashboards, multi-page workflows, and apps with deep navigation.
C-shape
Header + left navigation + right sidebar.
Ideal when you need context panels, help sections, or summaries alongside your main content.
R-shape
Header + right sidebar.
Useful when navigation isn’t the star, but contextual information is.
You don’t need to memorize these names, you’ll recognize them instantly because they mirror how users already expect apps to behave.
The Best Part: You Don’t Rebuild Layouts Every Time
Once you choose a floorplan:
- spacing is handled
- alignment is handled
- responsiveness is handled
- accessibility rules are applied
You focus on what goes inside the page, not how the page holds itself together.
This alone saves hours, sometimes days across a project.
But What If One Page Needs to Be Different?
Good question.
And JDP thought about that too.
You can:
- set a default floorplan for the entire app
- override it for specific routes when needed
So instead of redesigning everything:
- 90% of pages stay consistent
- 10% get special treatment
This keeps your app clean without boxing you in.
Floorplans vs Layouts (Yes, They’re Different)
This is where many developers get confused.
Floorplan = the overall page structure
Layout = how content is arranged inside the content area
Floorplan decides:
“Do I have a header? Nav? Sidebar?”
Layout decides:
“Is this content one column, two columns, or a grid?”
JDP separates these concerns so you don’t mix structural decisions with content decisions, a surprisingly powerful idea.
Why Developers End Up Loving Floorplans
At first, floorplans feel restrictive.
Then something interesting happens.
You realize:
- pages look consistent without effort
- new developers understand the app faster
- layout bugs drop drastically
- reviews become easier
- design debates disappear
Floorplans quietly enforce good UI discipline, without yelling about it.
Final Thought
Good UI isn’t about fancy components, it’s about solid structure.
JDP floorplans give you that structure upfront, so you don’t spend the rest of the project fixing layout problems that should never have existed.
Once you start using them properly, you’ll wonder how you ever built large apps without them.
Top comments (0)