From blob to icon: polishing the IONA OS GUI — scrollbars, vector icons, and the art of fixing UI that was "almost there"

A kernel is the heart of an operating system. But a desktop is the face.

IONA OS now has a stable kernel, a working compositor, and a growing set of applications. But until recently, some parts of the GUI were still rough around the edges — scrollbars that didn't scroll, icons that were indistinguishable blobs, and selections that disappeared into the void.

This week, I fixed all of that.

Here's what I polished in the IONA OS GUI — scrollbars, vector icons, and a few UI bugs that were "almost there" but not quite.

---

1. Vector Icons — From Blob to Distinct

IONA OS uses vector rendering for dock and launcher icons (draw_icon_vector_glow). But a few applications didn't have their own vector art, so they fell back to a generic rounded blob — indistinguishable from every other missing icon.

The affected applications were:

• Notes (Dock)
• Backup / Save (Launcher)
• IONA Vault / Key (Launcher)
• IONA Bluetooth / Share (Launcher)
• Text Editor / Edit (Launcher)

They all look like this:

Generic blob — no identity

Now, each has its own distinct vector shape:

Application	Icon	Description
Notes	📝	Notepad with lines
Backup	💾	Floppy disk / save symbol
Vault	🔑	Key shape
Bluetooth	🔗	Connected nodes
Text Editor	✏️	Pencil / edit symbol

The code uses the existing vec_draw() infrastructure, so no new rendering pipeline was needed — just a few extra match arms in the icon dispatcher:

// src/gui/primitives.rs (conceptual)
Icon::Notes => {
// notepad with lines
v_rect(…);
v_line(…);
v_line(…);

Icon::Vault => {
// key shape
v_ring(…);
v_rect(…);
}

Now every icon in the dock and launcher is visually distinct. No more blobs.

1. Scrollbars — Finally Real Several applications had content that could overflow the screen, but no scrollbar to indicate where you were.

Before:

Files: no scroll indicator at all.

Mail: selection could scroll off-screen and never return.

Notes: same bug as Mail.

Browser: no scrollbar for web content.

Terminal: only a text line reading "scrollback 42%" — no visual thumb.

After:

All these applications now use a common helper: gui::widgets::scroll_view::draw_scrollbar_buf.

The helper draws a consistent scrollbar on the right side of the viewport, with a thumb that scales to the visible content.

Here's the shared code (simplified):

// src/gui/widgets/scroll_view.rs
pub fn draw_scrollbar_buf(
pixels: &mut [u32],
width: usize,
height: usize,
scroll: &mut ScrollState,
total: usize,
visible: usize,

///if total <= visible { return; }
let thumb_height = (visible as f32 / total as f32 * height as f32) as usize;
let thumb_y = (scroll.offset as f32 / (total - visible) as f32 * (height - thumb_height) as f32) as usize;
// draw thumb on the right side
for y in thumb_y..thumb_y + thumb_height {
for x in width - 8..width - 2 {
pixels[y * width + x] = 0x444444;
}

This centralises the logic, so every application gets the same visual style — and I don't have to implement scrollbars six times.

Specific fixes:

Mail & Notes: Selection can no longer scroll off-screen. When you move the selection past the visible area, the list auto-scrolls to keep it in view.

Browser: The content area now has a real scrollbar (not just a static toolbar).

Terminal: The "scrollback 42%" text is gone. Now there's a real thumb on the right edge.

1. Browser Toolbar — Icons, Not Text The browser toolbar had buttons that were drawn as text symbols:

< > R X S H

Which worked, but looked rough and inconsistent.

Now they're proper bitmap icons:

• Symbol Icon
• < Back
• > Forward
• R Refresh
• X Close
• S Lock (secure)
• H Unlock (insecure)

The icons use the same Icon enum as the rest of the system:

Icon::Back,
Icon::Forward,
Icon::Refresh,
Icon::Close,
Icon::Lock,
Icon::Unlock,

This makes the browser toolbar visually consistent with the rest of the desktop.

1. Calendar — Real Back/Forward Icons The calendar header had < and > as plain text. Now they're real Icon::Back and Icon::Forward bitmap icons.

It's a small change, but it makes the navigation feel more responsive and polished.

1. The Big Picture: Why Small Details Matter None of these changes are revolutionary. They're small, incremental improvements.

But together, they transform IONA OS from a system that technically works into a system that feels good to use.

A scrollbar that actually moves.

An icon that tells you what it represents.

A selection that stays visible.

These are the details that users notice — even if they don't consciously think about them.

What's Next
IONA OS is still in active development. The kernel is stable, the AI is growing, and the GUI is getting polished.

The first public ISO is scheduled for September 15, 2026.

If you're interested in seeing more, here are the links:

Website: iona.zone
GitHub: github.com/Ionablokchain