Day 4: Why I Spent More Time on UI Than Features

Today I completed both core features of SpeakSheet (AI Excel generator).

Then I spent twice as long rebuilding the UI.

Here's why that mattered more than I expected.

---

What I Shipped Today

Feature 1: Generate Excel from Text ✅

User flow:

1. Type: "Client orders: Name, Product, Quantity, Price, Date"
2. Click "Generate"
3. Download formatted Excel file (~10 seconds)

Backend: Gemini API → Schema generation → Excel creation

Status: Complete

---

Feature 2: Upload + Intelligent Data Insertion ✅

User flow:
What it does:
→ User uploads messy Excel file
→ Types: "Client orders: Name, Product, Quantity, Price, Date"
→ AI finds the right table and inserts into the new updated file
→ Download the file

Backend: File parsing → AI matching → Validation → Insertion

Status: Working, needs more edge case testing

---

The Problem I Didn't Expect

Both features worked perfectly on the backend.

But when I tested with 3 friends yesterday:

Every single one thought it was broken.

Why?

The UI gave zero feedback.

User clicks "Generate" → 10 seconds of silence → File appears

During those 10 seconds:

• AI is processing ✅
• Schema is generating ✅
• Excel file is being created ✅

But users see: Nothing.

Result: "Is this working? Should I click again?"

The Rebuild: Adding Micro-Interactions[Demo Code for understanding Purpose]

I spent 6 hours today adding feedback for every state.

1. Button States

Before:

<button onClick={handleGenerate}>
  Generate Sheet
</button>

<button 
  className={`
    transition-all duration-200
    hover:scale-[1.02] hover:shadow-lg
    active:scale-[0.98]
    disabled:opacity-50 disabled:cursor-not-allowed
    ${loading ? 'pointer-events-none' : ''}
  `}
  onClick={handleGenerate}
  disabled={loading}
>
  {loading ? (
    <>
      <Spinner className="animate-spin" />
      Generating...
    </>
  ) : (
    <>
      <Sparkles />
      Generate Sheet
    </>
  )}
</button>

Impact:

Hover: User knows it's clickable
Loading: Shows something is happening
Disabled: Can't double-click

Providing the right UI makes or breaks the product.
Building SpeakSheet in public.
@NotVarunKV

Day 4 down. Many more to go.
Questions? Drop them in the comments 👇