UILooker: Responsive Design Testing Tool
Building a Fast, Free Tool for Testing Websites Across All Devices
The Challenge
As a developer, I constantly needed to test how websites look across different devices. Existing tools were either slow, required sign-ups, or had limited device options. I wanted something instant, free, and comprehensive.
The Goal: Create a lightning-fast responsive design testing tool that works instantly without any backend, sign-ups, or loading delays.
What is UILooker?
UILooker is a free, client-side responsive design testing tool that lets you instantly preview any website across 50+ device presets. It's built entirely with vanilla JavaScript, HTML, and CSS—no frameworks, no backend, just pure performance.
Zero Loading Time
Instant preview with no server requests or delays
50+ Device Presets
iPhone, iPad, Android, tablets, and desktop sizes
Device Rotation
Switch between portrait and landscape modes instantly
Custom Viewports
Test any custom width and height combination
Key Features
No Sign-Up Required
Start testing immediately without creating an account or providing any information
Real-Time URL Updates
Change URLs on the fly and see instant results
Mobile-First Design
Works perfectly on all devices, including mobile browsers
Completely Free
No premium features, no paywalls—everything is free forever
Open Source
Fully open-source on GitHub for transparency and contributions
Lightweight
No heavy frameworks—just clean, efficient vanilla JavaScript
Technical Implementation
UILooker is built with simplicity and performance in mind. Here's what makes it tick:
Frontend
- Vanilla JavaScript: No frameworks for maximum performance
- HTML5: Semantic markup with iframe embedding
- CSS3: Modern styling with flexbox and grid
- Responsive Design: Mobile-first approach
Device Presets
- iPhone Series: 14 Pro Max, 13, 12, SE, and more
- iPad Series: Pro, Air, Mini in various sizes
- Android Devices: Samsung, Pixel, OnePlus
- Desktop: Common monitor resolutions
Core Features
- Iframe Rendering: Isolated website preview
- Dynamic Resizing: Real-time viewport changes
- Rotation Logic: Swap width/height for orientation
- URL Validation: Ensure proper URL formatting
Deployment
- GitHub Pages: Free, fast static hosting
- No Backend: Completely client-side
- CDN Delivery: Fast global access
- Zero Cost: No server or hosting fees
How It Works
Enter Website URL
Type or paste any website URL into the input field. UILooker automatically adds https:// if needed.
Select Device
Choose from 50+ device presets or enter custom dimensions for specific testing needs.
Instant Preview
The website loads instantly in an iframe with the exact dimensions of your selected device.
Test & Rotate
Rotate devices, switch between presets, or adjust custom dimensions—all in real-time.
Design Philosophy
Speed First: No backend means zero latency. Everything happens instantly in the browser.
No Barriers: No sign-ups, no tracking, no data collection. Just a tool that works.
Developer-Friendly: Built by a developer for developers with the features we actually need.
Keep It Simple: Vanilla JavaScript proves you don't need heavy frameworks for great tools.
Perfect For
- Web developers testing responsive designs
- UI/UX designers previewing mockups
- QA teams verifying cross-device compatibility
- Clients reviewing websites on different devices
- Students learning responsive web design
- Anyone who needs quick device previews
Why I Built This
As a backend developer who also works on frontend projects, I found myself constantly needing to check how websites look on different devices. Browser dev tools are great, but sometimes you want to see the actual dimensions and test multiple devices quickly.
Most existing tools were either:
- Too slow with server-side rendering
- Required sign-ups and accounts
- Had limited free tiers
- Were bloated with unnecessary features
I wanted something simple, fast, and free. So I built UILooker in a weekend using just vanilla JavaScript. No frameworks, no backend, no complexity—just a tool that works.
Results & Impact
Conclusion
UILooker proves that you don't need complex frameworks or backends to build useful tools. Sometimes the best solutions are the simplest ones. By focusing on speed, simplicity, and user experience, I created a tool that I use daily and hope others find valuable too.
This project showcases my ability to think from a user's perspective, build efficient client-side applications, and deliver practical solutions without overengineering.