13.7 Layout and Design Principles
| Principle | What to do | Common mistake |
|---|---|---|
| Top-left is read first | Most important KPI cards across the top, left to right | Putting the filter panel or logo in the most valuable spot |
| Z pattern | Cards → trend → breakdowns → detail table | Random placement |
| One screen | Fit to one laptop screen (about columns A:W, rows 1:35 at 100% zoom) | Scrolling dashboards |
| Few colours | One brand colour + grey; red/green only for bad/good | Every series a different colour |
| Consistent format | Same font, same number format (₹ L), same card size | Mixing ₹4950000 and ₹49.5 L |
| White space | Equal gaps between objects | Everything squeezed together |
| Label the context | Title, data period, "Data up to 31-03-2026, 11:59 PM IST", source note | No date – user doesn't know if it is fresh |
| Accessible | Do not rely on colour alone (add ▲/▼), enough contrast | Red/green only |
About this data: Teaching sample for a fictional shop “QuickCart Delivery”. Figures and names (e.g. Rohan Patil) are made up for this lesson on layout and design principles.
Worked example – layout sketch.
| Columns B–E | Columns F–W | |
|---|---|---|
| Rows 1–3 | Title: "FreshGo Maharashtra – Sales Dashboard" | Data date, fictional-data note |
| Rows 4–9 | Slicers: City, Platform | KPI cards: Net Sales · Orders · AOV · Cancellation % · Avg Delivery |
| Rows 10–21 | Slicer: Category | Line chart: daily sales (full width) |
| Rows 22–35 | Timeline | City bar chart · Category bar · Platform doughnut |
About this data: Demo table only — not real customer or company data. Built to practise layout and design principles.
Steps in Excel – finishing the layout
- View › Zoom › 100%; check the dashboard on a normal laptop screen.
- Select all charts/shapes (Home › Editing › Find & Select › Selection Pane) and rename objects meaningfully (
chtCity,cardSales). - Right-click each chart › Format Chart Area › Properties › Don't move or size with cells so hiding columns doesn't squash them.
- Put the insertion cell in A1 and save – the file then opens at the top.
Ravindra Bagale's Tip
To make a dashboard "beautiful", many students use a background image, a logo and lots of colours – and the important KPI ends up in some corner at the bottom. Remember: everything important goes top-left, on one screen, with a single highlight colour. Always write a "Data up to" date on the dashboard – that's the first thing a manager asks.
Ravindra Bagale's Tip – मराठी
Dashboard ला "सुंदर" बनवण्यासाठी बरेच students background image, logo आणि खूप रंग वापरतात – आणि महत्त्वाचा KPI खाली कुठल्यातरी कोपऱ्यात जातो. लक्षात ठेवा: सगळं महत्त्वाचं top-left ला, एका screen मध्ये, आणि एकच highlight रंग. Dashboard वर "Data up to" date नक्की लिहा – manager ला आधी हेच विचारायचं असतं.
Ravindra Bagale's Tip – हिंदी
Dashboard को "सुंदर" बनाने के लिए बहुत से students background image, logo और बहुत सारे रंग इस्तेमाल करते हैं – और ज़रूरी KPI नीचे किसी कोने में चला जाता है. याद रखो: सब ज़रूरी चीज़ें top-left में, एक screen में, और एक ही highlight रंग. Dashboard पर "Data up to" date ज़रूर लिखो – manager सबसे पहले यही पूछता है.
Worked example — layout and design principles
Why
Vikram Rao in Pune and Emma Clarke abroad both need a clear, repeatable way to use layout and design principles on a NovaCraft Tools sheet without breaking totals.
What
Layout And Design Principles is the Excel idea this page teaches. We will walk one tiny example end to end.
How
- Open a blank sheet. In A1 type a short label for layout and design principles.
- Enter a small made-up value for Vikram Rao using € where money appears.
- Add a second value for Emma Clarke using $ so you see mixed currencies stay numeric.
- Apply the method from this lesson step by step (menu or formula as shown above).
- Check the result still works inside SUM or a simple check cell.
Formula / action
Follow the formula or ribbon steps shown in this lesson (keep values numeric).Meaning: Once layout and design principles is correct on one row, copy the same pattern down the column.
Practice tasks (10+)
Try these on a blank sheet. Open a hint only if you are stuck. No quiz — just practice.
1. Rebuild the smallest example of layout and design principles on a blank sheet for FreshGo Mart.
Hint: Use only the steps on this page. Keep numbers numeric.
2. Change one input for Priya Deshmukh and confirm the result updates.
Hint: If the result is stuck, check absolute vs relative references.
3. Repeat the same steps with a £ or € value for Oliver Bennett.
Hint: Formatting must not break SUM.
4. Write the result meaning in one plain sentence next to the cell.
Hint: Imagine explaining it to a new joiners.
5. Add a second row and fill the method down.
Hint: Double-click the fill handle if the pattern is consistent.
6. Break the example on purpose, then fix it using this lesson.
Hint: Common break: text instead of a number.
7. Apply layout and design principles to a 5-row made-up FreshGo Mart table.
Hint: Keep column headers clear.
8. Check your answer with a simple total or COUNT.
Hint: A wrong total usually means a format or key mismatch.
9. Swap ₹ and $ on one column and re-check totals.
Hint: Stored values stay the same; only the display changes.
10. List two mistakes beginners make with layout and design principles.
Hint: Look back at the tip box on this page.
11. Teach the steps out loud in under one minute.
Hint: Why → What → How.
12. Save the sheet as FreshGoMart_practice.xlsx.
Hint: Use a clear file name for class.
Quick revision cards
Three standalone cards. Each one explains the idea with its own example. Scan the QR to open this lesson.
