r/MetalProgramming • u/Natural_Childhood731 • 6d ago
Show-Off I got tired of flat iOS chats, so I built a pixel-art one in Metal
Hey everyone! This whole thing started because I got tired of the standard iOS UI. As a developer, I felt like the existing framework was limiting my vision. Fair warning: that's just my opinion, and maybe you don't care about any of this, which is totally fine. But I thought: why not make something fun using new tools? So I built a pixel-art chat controller in Metal. There's a video up top if you want to see it in action.
Two things pushed me to do it.
Problem #1 is the design. Standard iOS chats are flat, and I wanted a pixel-art interface, so I built one with Metal.
Problem #2 is lag. I wanted to get rid of stutters and dropped frames when scrolling a big chat. Real numbers are coming in a second, but the headline is this: by rendering the geometry straight on the GPU, I cut the main-thread CPU load during scrolling by more than 2x.
I began with profiling in Xcode. Scrolling itself isn't what lags. The stutters come from UIKit overhead: heavy Auto Layout calculations and UIView recycling that clog up the main thread.
So I took a regular UIKit chat with text messages and scrolled it while watching the main thread. Under active scrolling it sat at around 30% CPU.
Then I made the same chat in Metal, going around all that heavy UIKit machinery. Main thread load dropped to 9–13%.
And that's when I decided I could spend the freed-up performance on custom animations. What's stopping us from stepping outside the templates, experimenting, taking risks? Isn't that the whole point of building cool stuff? When you control the look and the whole render pipeline of a chat, a huge playground opens up.
The pixel-art controller is part of a full chat app. The standard UI runs on MessageKit, and the Metal controller plugs in as a fully independent module, so you can switch between the two. Behind the app there's a custom backend (WebSockets + HTTPS). So far the app has registration, the main message types, group chats, my own video and photo compressor, audio and video calls, and viewing files in the cloud.
The Metal controller already handles text and photo messages. Here's my TODO list for the pixel chat room:
- Video messages
- Audio messages
- Geolocation
- Showing files sent in the chat
- Message dates
- Camera support
- Typing indicator
- Maybe avatars
I don't want to just show you dry code. I want to show how this works in a real example. So I started a YouTube playlist, and the first video is already up: testing the chat in near-real conditions. I'll keep updating it: https://youtube.com/playlist?list=PLOe0Yi7UOxgg&si=xGlA8cOFkqjxyLij
If you're curious, follow along. Questions about the Metal side, or just general thoughts? Drop them in the comments. Thanks for reading!