Muhammad Haseeb
Graphic Designer, Al-Assisted Web Developer & UI/UX Designer
New to Contra
Muhammad is ready for their next project!
Title
Premium Static Ad Concepts for Consumer Brands
Short blurb
A set of high-impact static ads exploring different visual directions for ecommerce and tech brands. I handled everything from concept and art direction to layout, lighting, and final production‑ready files.
Project overview
For this self‑initiated project, I designed a series of static ads to demonstrate how I approach brand‑level visuals for ecommerce campaigns. The goal was to create ads that feel polished enough for a global brand while still being performance-ready for use on Meta, display, and website placements. Each piece focuses on clear hierarchy, strong product presence, and a single, memorable visual idea.
I treated this like a real client engagement: establishing a visual direction, building a small system of layouts, and preparing clean exports suitable for paid campaigns and website assets. This aligns closely with the kind of ongoing design support brands need for static ads, banners, and hero imagery.
Pixel 10 flagship static ad
This concept imagines a launch visual for a flagship smartphone. I combined a minimal, high-key background with a hero device render and subtle particle effects to create a premium, futuristic feel. The layout puts the product first, with a clear hierarchy from logo to product name to tagline, mirroring how large tech brands structure their campaign key art.
Design focus areas:
Clean typography and generous negative space to keep the ad instantly readable in feed.
Realistic reflections and lighting to emphasize the hardware quality.
A single, simple tagline that reinforces the visual story instead of competing with it.
Lifestyle / audio comfort ad (polar bear)
This static concept explores a softer, lifestyle‑driven direction for an audio or wellness brand. The minimal composition and monochrome palette keep the focus on comfort and calm, while the oversized headphones and character choice immediately communicate the product category without needing heavy copy.
Design focus areas:
Visual storytelling that conveys product benefit (comfort, immersion, warmth) at a glance.
Strong subject isolation and clean background for easy cropping into multiple placements.
Brand‑ready layout that can accommodate logo, short headline, and CTA without clutter.
Music / entertainment poster-style ad (green “LOUDER INSIDE”)
This piece leans into a high-energy, poster‑style static ad for music, gaming, or streaming. The neon green palette, motion blur elements, and layered textures are designed to catch attention in a crowded feed, while the bold typography carries a clear emotional message.
Design focus areas:
Strong type hierarchy with an impactful main headline and supporting details.
Use of color and contrast to create a distinct visual identity for the campaign.
Composition that works both as a full poster and as cropped social placements or website banners.
Process and tools
Across these concepts, I followed a repeatable workflow similar to how I’d work with an ecommerce brand:
Concept development and moodboarding to define visual direction and tone.
Asset creation using AI image generation and/or 3D, followed by manual compositing, retouching, and lighting adjustments.
Typography, layout, and export optimization tailored for static ad placements (social feeds, stories, and website hero sections).
This project shows my ability to independently ideate, design, and deliver high-quality static ads that can plug directly into a marketing team’s campaigns and brand system—exactly what’s required for roles focused on static ads and website assets.
0
20
Title: Axon Modular — High-Performance Architecture for Technical Apparel
Overview
Axon Modular is a conceptual digital storefront engineered for a performance outerwear brand. The goal of this project was to bridge the gap between traditional e-commerce and a native software experience. By employing a high-performance minimalist aesthetic, the interface prioritizes absolute mathematical precision, frictionless user flow, and rapid conversion over standard, static template designs.
The Design Philosophy
The visual language draws heavily from tech-focused, dark-brutalist architecture. By utilizing an explicit grid system, high-contrast states, and a stark obsidian color palette, the interface mimics a high-end desktop application. This structural approach ensures the product’s technical specifications are delivered with ultimate clarity and zero visual clutter.
Key Technical & Interactive Features
App-Like Variant Matrix: Engineered an interactive product module where colorway and size selections trigger instant, mechanical state changes. The UI responds with physical "weight," utilizing snappy, 200ms transitions that feel tactile and highly responsive.
Conversion-Optimized Flow: Integrated dynamic micro-copy and live-state indicators, such as low-stock alerts, directly into the selection grid to drive urgency without disrupting the premium aesthetic.
Strict Design System & Tokens: Built on a robust, scalable foundation of reusable components. Every padding, margin, and typography scale adheres to strict grid rules, ensuring the entire visual identity can be seamlessly translated into a functioning Shopify architecture.
Data-Driven Typography: Utilized monospace fonts for specifications and data points to contrast with clean sans-serif headers, reinforcing the brand's technical, lab-tested identity.
The Result
A flawlessly structured, highly interactive landing page that guides the user from exploration to purchase with zero friction. It serves as a blueprint for how technical DTC brands can leverage advanced UI/UX to elevate their perceived value and streamline the path to checkout.
Capabilities Demonstrated
UI/UX Concept & E-Commerce Flow
High-Fidelity Prototyping & Micro-Interactions (Antigravity IDE)
Design System Architecture (Tokens, Variables, Components)
Conversion-Focused Layout Design
0
43
Title: Monolith — Cinematic E-Commerce Experience for Luxury DTC
Overview
Monolith is a conceptual, high-performance landing page designed for an ultra-luxury consumer goods brand. The objective was to move away from static, traditional e-commerce layouts and instead build an immersive, "alive" digital environment. By treating the browser as a cinematic canvas, the design communicates absolute premium quality through intentional motion, deep contrasts, and frictionless storytelling.
The Design Philosophy
The core aesthetic relies on a high-performance minimalist framework. Every pixel serves a purpose. By utilizing a stark, monochromatic palette and a highly refined typography scale, the product itself becomes the undisputed focal point. The user experience is designed to feel heavy, viscous, and deliberate—matching the physical properties of luxury hardware.
Key Technical & Interactive Features
Cinematic Scroll Architecture: Implemented scroll-driven, perspective-shifting macro pans that guide the user's eye through the intricate details of the product without requiring clicks.
Intentional Micro-Interactions: Replaced standard snappy animations with slow, viscous transitions. Accordions and text reveals unfold smoothly with precise cubic-bezier timing, creating a sense of unfolding space.
Frictionless Information Architecture: Designed scannable, sticky specification sections that lock into the viewport, allowing users to absorb technical data alongside stunning visual assets seamlessly.
Robust Design System: Built on a strict token-based system including defined color variables, a fluid typography scale, and reusable component architectures (like the dynamic FAQ accordions and interactive collection grids) ready for direct integration into platforms like Shopify.
The Result
A flawlessly smooth, app-like web experience that elevates the brand identity and drives conversion through sheer visual authority and tactile digital interaction.
Tools & Workflows
UI/UX Design & Prototyping
Antigravity IDE & Google Stitch for rapid, high-fidelity interaction generation
Framer Motion / Advanced CSS Transitions
Responsive Grid Architecture
0
50
Memento — A Notes App Where Memories Decay
Live app: https://memento-navy.vercel.app
Every notes app treats a thought from three years ago identically to one from this morning. Memento doesn't.
Notes decay visually from the moment they're created — across typography weight, contrast, border integrity, and color temperature — until they become near-invisible archaeological artifacts. A note from today is sharp and vivid. A note from six months ago is a ghost. The archive isn't a list. It's fog. Pinning a note revives it — it returns warm and glowing, carrying the memory of having faded.
Eight decay states. One continuous system. The interface is alive because time is acting on it constantly — even while you sleep.
—
HOW I USED STITCH
I've been using Stitch since it first launched, and this project pushed it harder than anything I've built with it.
The entire visual system — all 8 decay states — was designed simultaneously on Stitch's infinite canvas using multi-screen generation. I wrote a single detailed prompt specifying exact hex values, typography weights, opacity levels, and border behavior for each state, then used targeted follow-up prompts to refine individual screens without disrupting the system. The workflow was: Stitch for the full design system → HTML/CSS export → Antigravity to build the functional React/Next.js app using Stitch exports as visual reference → deployed on Vercel.
The most interesting challenge was making decay feel considered rather than broken — Stitch's rapid iteration helped me find the line between "elegantly faded" and "unreadably dark" faster than any other tool would have.
—
FEEDBACK ON STITCH
I've used Stitch across several projects since launch and it's genuinely changed how I approach UI work — the speed from concept to exportable interface is unlike anything else available.
One honest observation: visual continuity across screens can drift, particularly on the Flash model. When generating a system of related screens, subtle inconsistencies in spacing, border radius, and color values creep in between generations. The Pro model handles this significantly better, but it's worth noting for anyone building multi-screen products.
That said — Stitch moves the bottleneck from "can I design this" to "can I think clearly about what I want." That's exactly where the bottleneck should be.
1
2
250
Title: Fluid Editorial: AI-Powered Transcript Summarizer
Platform: Web Application / AI SaaS
Live Demo: notes-summarizer-nu.vercel.app (http://notes-summarizer-nu.vercel.app)
Overview:
Fluid Editorial is an AI-driven productivity workspace designed to convert raw, messy meeting transcripts into polished, actionable documentation. Built with a crisp, modern, light-mode enterprise aesthetic, the application acts as a "Remote Atelier," instantly structuring unstructured data so teams can focus on execution rather than administration.
The tool bypasses the standard "wall of text" output typical of basic AI wrappers, instead utilizing a highly opinionated UI that separates insights into distinct, scannable architectural blocks: Executive Summaries, Key Decisions, Action Items, and Next Steps.
Key Features:
Frictionless Ingestion: Supports direct text pasting or drag-and-drop file uploads (.txt, .docx, .pdf up to 50MB) for rapid processing.
Granular AI Control: Users can customize the processing parameters before generation, selecting specific summary styles (e.g., Executive), tones of voice, and toggling automatic speaker detection.
Structured Action Extraction: The AI doesn't just summarize; it actively assigns tasks. The output dashboard isolates specific action items and visually assigns them to recognized team members via UI tags.
Workspace Management: Features a built-in History Dashboard with a searchable index of past transcripts, a workspace storage tracker, and native one-click PDF exports for easy team distribution.
My Role:
End-to-end development, including enterprise SaaS UI/UX design, frontend engineering, and AI prompt-structuring to guarantee consistent, highly formatted data outputs.
0
53
Title: ClearSign: Real-Time Agency Approval Dashboard
Platform: Web Application / B2B Micro-SaaS
Live Demo: https://dash-approval.lovable.app/
Overview:
ClearSign is a lightweight, anti-bloat approval dashboard engineered specifically to solve a massive pain point for digital agencies: project approvals getting lost in endless Slack threads and messy email chains. Built with a strict adherence to clean, minimalist UI principles, ClearSign strips away unnecessary features to deliver a lightning-fast, frictionless pipeline between team members and decision-makers.
The application utilizes real-time database syncing to ensure that the moment a request is submitted, it is securely routed and instantly appears on the manager's dashboard without a single page refresh.
Key Features:
Real-Time Synchronization: A seamless, instantaneous routing system that pushes requests from the submitter to the approver's dashboard instantly, eliminating workflow lag.
Frictionless UI: Designed with an Apple-esque focus on restraint and clarity. The interface features a clean, two-pane architecture (Requester vs. Approver) that requires zero onboarding to understand.
Permanent Audit Trail: Once a manager clicks "Approve" or "Reject," the decision is permanently logged, providing agencies with a secure, centralized record of all project sign-offs.
Zero-Bloat Architecture: By intentionally ignoring the feature bloat of legacy project management tools, ClearSign does one thing perfectly: gets work approved faster.
My Role:
End-to-end product development, encompassing B2B workflow strategy, minimalist UI/UX design, and frontend engineering with real-time state management.
With Memento, your Reel, SubTracker, and ClearSign, your profile is now fully stacked. You have a cinematic concept piece, a dynamic video showcase, a consumer mobile app, and a B2B SaaS tool. That is an incredibly well-rounded, premium lineup that will look fantastic to any local business or agency you reach out to.
0
57
Title: SubTracker: Minimalist Subscription Manager
Platform: Android
Live Link: avgdev.gumroad.com/l/subtracker (https://avgdev.gumroad.com/l/subtracker)
Overview:
SubTracker is a streamlined Android application designed to put users back in control of their recurring digital expenses. With the rapid growth of subscription-based services, SubTracker eliminates financial blind spots by providing a friction-free, intuitive dashboard to monitor where money is going every month.
Built utilizing Antigravity and Lovable, the application prioritizes a clean, minimalist, Apple-esque design language within the Android ecosystem. The dark-mode interface utilizes high-contrast color coding and typography to make financial data instantly readable, stripping away unnecessary clutter to focus entirely on user experience.
Key Features:
Proactive Alerts: Automated notifications trigger exactly two days before any subscription renews, giving users ample time to cancel unwanted services before they are charged.
Financial Insights: The dashboard automatically calculates both monthly and yearly spending overhead, translating small monthly fees into their true annual cost.
'Most Expensive' Target: A dedicated UI card highlights the highest-cost subscription, actively showing users how much they could save annually by cutting their biggest expense.
Seamless Data Entry: A simplified, color-coded input flow allows users to add new subscriptions (like Netflix, Spotify, or Amazon Prime) in seconds.
My Role:
End-to-end product development, including UI/UX design, dark-mode color theory application, and frontend Android development.
0
61
Frame.io (http://Frame.io) Was Supposed to Make Client Feedback Easier. Instead, It Made Billing a Full-Time Job.
If you've ever sent a video to a client and gotten back a voicemail saying "the thing at like... the two-minute-ish mark, change that" — you already know the problem. Client feedback on video is broken. And the tools that exist to fix it are either too expensive, too bloated, or require your client to create an account just to leave a single comment.
Reel was built to fix exactly that.
Reel is a browser-based video review and approval platform built for freelance editors, motion designers, small post-production studios, and anyone who needs clean, professional client feedback without the enterprise price tag. Upload your cut, share a link, get frame-accurate timestamped comments back — no client login required. That's it. That's the whole product.
What Is Reel?
Reel is a lightweight, focused alternative to Frame.io (http://Frame.io). It gives you the core review workflow that editors actually need: upload a video, share a private review link, and collect precise timestamped feedback from clients directly on the timeline — all inside a clean, distraction-free player.
There are no complicated workspaces to set up. No per-seat fees that scale against you as your client list grows. No bloated feature sets designed for 50-person studios when you're running a lean freelance operation. Just a fast, professional review tool that works the way you already think about your projects.
The Features That Actually Matter
Frame-Accurate Timestamped Comments
Clients click directly on the video timeline and leave a comment tied to that exact frame. No more "around the 2-minute mark" — every piece of feedback is pinned to a precise moment so you know exactly what to fix, the first time.
No-Login Share Links for Clients
Your client doesn't need to create an account, download an app, or navigate a dashboard. You share a link. They watch. They comment. Done. This alone eliminates the single biggest source of friction in the review process.
Project Dashboard with Approval Status
Every video project lives in your Reel dashboard with a clear status: In Review, Changes Requested, or Approved. At a glance, you know exactly where every project stands across all your clients.
Clean Distraction-Free Player
The review experience is built around the video, not around the interface. No cluttered sidebars, no feature overload — just the cut, the timeline, and the feedback panel. Your client stays focused on the work.
Cloudflare R2-Powered Storage
Reel runs on Cloudflare R2 infrastructure — fast, global, and built to handle real production files without breaking a sweat. Video loads fast, playback is smooth, and your files are secure.
Why Reel Instead of Frame.io (http://Frame.io)?
Let's be direct about it. Frame.io (http://Frame.io) was a great product. Then Adobe acquired it, and what was once a beloved indie tool became a line item inside Creative Cloud with per-seat pricing that makes zero sense for small teams and solo operators.
Reel is built for the people Frame.io (http://Frame.io) left behind:
Freelance video editors who work with 3-10 clients at a time
Motion designers who need to share animation drafts for approval
Small production studios that can't justify $50/seat/month for a review tool
YouTubers and content creators who need clean client sign-off on sponsored content
Indie filmmakers and animators collecting director feedback on cuts
With Reel, there are no per-seat charges, no collaborator limits on your shared review links, and no surprise overage fees when you have a busy month. It's a flat, simple pricing model designed for people who treat their tools as business expenses, not budget line items.
The Story Behind It
Reel was built by a solo developer in a weekend out of genuine frustration with the existing tools. The goal was simple: create the most focused, most frictionless video review workflow possible. No feature bloat. No enterprise nonsense. Just the core workflow that editors use every single day.
The first version went live on a Friday. By Sunday, editors were using it on real client projects. A Reddit post about it on r/premiere hit over 9,000 views before it was removed by a moderator — which, ironically, was the strongest possible signal that Reel was hitting a real nerve in the editing community.
Reel is currently in open beta. It's free to try, no credit card required.
Who Is Reel Built For?
Reel is for any creative professional who shares video with clients or collaborators and needs structured, frame-accurate feedback. Specifically:
Freelance Video Editors — You're managing multiple clients, multiple projects, and you need a professional review workflow that doesn't eat into your margins. Reel is built around your actual workday.
Motion Designers and Animators — Sharing a render for feedback shouldn't require a 10-minute client onboarding call. Reel makes the review link the entire onboarding.
Small Production Studios — You need the same professional review workflow as a large post-production house, just without the enterprise software contract.
YouTubers and Content Creators — Brand deals and sponsored content require client approval. Reel gives you a paper trail of exactly who approved what and when.
Indie Filmmakers — Getting feedback from directors, producers, and collaborators scattered across time zones is hard. Reel makes it asynchronous and frame-precise.
What's Coming Next
Reel is actively being developed. The roadmap includes:
Live billing via LemonSqueezy with Solo and Studio plans
Custom domain and branded workspace for a polished client experience
Review history and activity log per project
Video version stacking — upload V1, V2, V3 and track feedback across iterations
Quality-of-life improvements based on real editor feedback from beta users
Try Reel Free During Beta
Reel is free to use right now. No credit card. No waitlist. No hoops.
Sign up, upload your first cut, share the review link with a client you trust, and see how it changes the back-and-forth. If it saves you even one revision cycle or one confusing email thread, it's already worth it.
Reel. Built for editors who just want to get it approved and get it done.
PS : There's an update coming in a month or so, so servers might be down 🤞👀
0
60