Book a Call Now

Book a Call Now

Available for Q3 2026

Creative Tech & Design Partner

Creative Tech & Design Partner

Creative Tech & Design Partner

Creative Tech & Design Partner

Creative Tech & Design Partner

Creative Tech & Design Partner

Bold Brands via Product Design / Dev

Bold Brands via Product Design / Dev

Bold Brands via Product Design / Dev

Start a project →

Start a project →

Start a project →

I design & build for brands that drive revenue.

SELECTED WORKS

PORTFOLIO AT A GLANCE

From Brand Dev via Product Design to Functional Builds - see through each case study, one at a time.

VIEW ALL WORK

SELECTED WORKS

PORTFOLIO AT A GLANCE

From Brand Dev via Product Design to Functional Builds - see through each case study, one at a time.

VIEW ALL WORK

SELECTED WORKS

PORTFOLIO AT A GLANCE

From Brand Dev via Product Design to Functional Builds - see through each case study, one at a time.

VIEW ALL WORK

SUB:
Workflow Quest — An Instrument for Independents
AI LAB
App2026 · Live

Workflow Quest — An Instrument for Independents

A skeuomorphic 1980s Roland synthesizer terminal built inside Figma for Config Makeathon 2026. Assembles tool stacks into a 16-strand sequence with spring physics and Datacards.

►533 views · 17 likes · 7 reposts on Contra
SkeuomorphicRolandConfig MakeathonSpring Physics
Most Portfolio & Agency Service Sections
DEV
Framer Component2026 · Live

Most Portfolio & Agency Service Sections

Comprehensive architectural breakdown and expandable service section system designed for creative agencies, studios, and independent techpreneurs.

►Contra Community Dispatch · 2026
Framer Component
LevelUp — Edtech Platform Design for Contra University
EDUCATION
Web2025 · Live

LevelUp — Edtech Platform Design for Contra University

A free 42-day sprint platform that turns freelancers into verified Contra Experts. AI-powered personalized roadmap, accountability partner, and verified badge.

►1.2K views · 17 reposts · Full Prototype
EdtechCareer PlatformMobbin ChallengeAI Roadmap
Contra VIBE MATCH & Trust Scores
AI LAB
Product Design2025 · Live

Contra VIBE MATCH & Trust Scores

A physics-driven talent discovery experience built with Figma Make for the Figma Makeathon. A living constellation of talent responds to natural language instincts in real time.

►4.8K views · Featured on Contra Homepage
Physics DesignFigma MakeInteractionConstellationDribbble
BONDZ FINTEC — SaaS Landing Page Design
DESIGN
Framer Web Design2024 · Live

BONDZ FINTEC — SaaS Landing Page Design

A high-density single-page fintech SaaS landing page built natively in Framer. Dark-dominant, editorial, conversion-focused. Monochromatic moonlight aesthetic with 3D tilt motion.

►Framer Production · 3D Tilt Motion · Dark Mode
FintechSaaSLanding PageProduction Build
BONDZ — AI Companion SaaS Framer Build
DEV
Full Stack Product Dev2024 · Live

BONDZ — AI Companion SaaS Framer Build

An AI companion SaaS product built natively in Framer. Full production build demonstrating AI-native product design, dark mode editorial aesthetic, and conversion architecture.

►Full Framer Build · Edge Deployed
AI SaaSProduct DesignDark Mode
ADBONDZ — Creative Tech Agency
BRAND
Brand & Creative Design2024 · Live

ADBONDZ — Creative Tech Agency

Full brand identity and web presence for ADBONDZ, a creative tech agency. Brand strategy, visual identity, and complete digital execution delivered as a turnkey agency package.

►Brand Strategy · Visual Identity · Web System
AgencyBrand IdentityStrategyWeb Design
BONDZ SHOP — Digital E-commerce Figma Build
DESIGN
Web2024 · Concept

BONDZ SHOP — Digital E-commerce Figma Build

A digital e-commerce experience designed in Figma. Product listing architecture, cart flow, and full checkout UI — built with conversion-first logic and clean editorial design.

►E-commerce Architecture · Cart & Checkout Flow
E-commerceUI DesignConversion Architecture
Responsive Framer Hero Screen — ADBONDZ Agency
DEV
Framer Web Dev2024 · Live

Responsive Framer Hero Screen — ADBONDZ Agency

Responsive hero screen design built in Framer for ADBONDZ Agency. Full mobile-first responsive execution with spring interactions and editorial dark cyber-aesthetic.

►Mobile-First · Spring Interactions · Framer
FramerHero DesignMobile-First Responsive
Lasagna — One Page Business Landing Website
DEV
Web2024 · Live

Lasagna — One Page Business Landing Website

A clean, conversion-focused one-page business landing site. Structured around a single call to action with clear visual hierarchy, trust markers, and professional editorial layout.

►One-Page Landing · Conversion-Focused · Business
Landing PageBusinessOne-PageWeb Design

The work keeps moving.

Browse the complete record for systems, launches, experiments, and the decisions behind them.

Browse All Works →

Browse All Works →

Browse All Works →

CAPABILITIES INDEX

Four ways to build together.

A concise working index — strategic direction, production systems, and motion that earns its place.

START A CONVERSATION

CAPABILITIES INDEX

Four ways to build together.

A concise working index — strategic direction, production systems, and motion that earns its place.

START A CONVERSATION

CAPABILITIES INDEX

Four ways to build together.

A concise working index — strategic direction, production systems, and motion that earns its place.

START A CONVERSATION

SERVICE DETAIL / 05

Choose the shape of the engagement.

A focused scope, a clear outcome, and a direct route to a proposal — tailored from the service you selected.

← BACK TO PRICING

BUILD THIS →

SCOPE

A focused, outcome-led brief built around the work that matters most.

OUTCOME

A clear system that can be shipped, shared, and extended with confidence.

STARTING RANGE

Final scope and investment are set together in the proposal flow.

Transparent Pricing

Pricing Tiers.

Three clear ways to scope the work — with starting points carried over from the proposal engine.

Build a Custom Estimate →

Transparent Pricing

Pricing Tiers.

Three clear ways to scope the work — with starting points carried over from the proposal engine.

Build a Custom Estimate →

Transparent Pricing

Pricing Tiers.

Three clear ways to scope the work — with starting points carried over from the proposal engine.

Build a Custom Estimate →

Product & UX Design

UX research, wireframes, hi-fi UI, prototype. For apps, dashboards, and SaaS landing pages.

$2,500

UX Research & Discovery

Wireframes & Information Architecture

Hi-fi UI Design System

Interactive Prototype

Apps, Dashboards & SaaS

Async reviews and handoff

Clear scope and timeline

Framer Web Development

Pixel-perfect Framer site or web app. CMS, animations, responsive — shipped and live.

$1,600

Pixel-perfect Framer Build

CMS Collections & Dynamic Content

Animations & Micro-interactions

Fully Responsive — All Breakpoints

Shipped & Live with Custom Domain

Support via Trello + Slack

Turnkey 1–2 Week Delivery

Full Stack: Design + Build

Design + Framer build together — strategy, UI, and final delivery in one seamless engagement.

$3,400

Brand Strategy & Positioning

Full UX/UI Design System

Framer Build — Live & Shipped

CMS, SEO & Analytics Setup

Ongoing Revision Rounds Included

Support via Trello + Slack

Turnkey 2–3 Week Delivery

Workflow

Stacks

The instruments I use to build at the convergence of design, code, and AI.

Try Workflow Quest

Workflow

Stacks

The instruments I use to build at the convergence of design, code, and AI.

Try Workflow Quest

Workflow

Stacks

The instruments I use to build at the convergence of design, code, and AI.

Try Workflow Quest

🔍
🎨
Design & Systems11 INSTRUMENTS
FigmaUI/UX Canvas
FigJamUser Flows
FramerProduction Web
RiveState Machines
Blender3D Visuals
Ps
PhotoshopPixel Craft
Ai
IllustratorVector Systems
Figma MakeDesign Systems
AntigravityPhysics Simulation
Open DesignOpen Specs
Unicorn StudioShader FX
⚡
AI & Reasoning5 INSTRUMENTS
ClaudeFrontier Reasoning
GeminiDeep Research
ChatGPTRapid Prototyping
PerplexityFact Checking
StitchAgentic Pipes
💻
Development & Engineering6 INSTRUMENTS
VS CodeReact & TS IDE
CursorAI Pair Engineer
GitHubCI/CD & Repos
SupabasePostgres & Auth
Open CodeTerminal Tooling
Open WorkAgent Pipelines
⏱
Productivity & Operations9 INSTRUMENTS
NotionSecond Brain
ObsidianKnowledge Graph
LinearSprint Tracking
Cal.comClient Booking
SlackClient Channels
DiscordBuilder Hangout
ZoomArchitecture Calls
LoomAsync Handoffs
Google MeetInstant Gateway
🚀
Distribution & Social10 INSTRUMENTS
LinkedInDesign Network
X / TwitterReal-time Drops
InstagramVisual Artifacts
ContraStudio Profile
UpworkGlobal Contracts
DribbbleUI Micro-Craft
BehanceVisual Case Studies
YouTubeBuild Breakdowns
PinterestVisual Inspiration
FacebookCommunities
🎬
Creator & Motion3 INSTRUMENTS
Ae
After EffectsLottie Keyframes
Pr
Premiere ProVideo Teasers
DaVinci ResolveColor Master
🎨Design & Systems
11 TOOLS
Figma
UI/UX Canvas
FigJam
User Flows
Framer
Production Web
Rive
State Machines
Blender
3D Visuals
Ps
Photoshop
Pixel Craft
Ai
Illustrator
Vector Systems
Figma Make
Design Systems
Antigravity
Physics Simulation
Open Design
Open Specs
Unicorn Studio
Shader FX
⚡AI & Reasoning
5 TOOLS
Claude
Frontier Reasoning
Gemini
Deep Research
ChatGPT
Rapid Prototyping
Perplexity
Fact Checking
Stitch
Agentic Pipes
💻Development & Engineering
6 TOOLS
VS Code
React & TS IDE
Cursor
AI Pair Engineer
GitHub
CI/CD & Repos
Supabase
Postgres & Auth
Open Code
Terminal Tooling
Open Work
Agent Pipelines
⏱Productivity & Operations
9 TOOLS
Notion
Second Brain
Obsidian
Knowledge Graph
Linear
Sprint Tracking
Cal.com
Client Booking
Slack
Client Channels
Discord
Builder Hangout
Zoom
Architecture Calls
Loom
Async Handoffs
Google Meet
Instant Gateway
🚀Distribution & Social
10 TOOLS
LinkedIn
Design Network
X / Twitter
Real-time Drops
Instagram
Visual Artifacts
Contra
Studio Profile
Upwork
Global Contracts
Dribbble
UI Micro-Craft
Behance
Visual Case Studies
YouTube
Build Breakdowns
Pinterest
Visual Inspiration
Facebook
Communities
🎬Creator & Motion
3 TOOLS
Ae
After Effects
Lottie Keyframes
Pr
Premiere Pro
Video Teasers
DaVinci Resolve
Color Master

Approach

Continuous practice.

Strategy, design, and build held in the same conversation — from first question to shipped system.

START A CONVERSATION

Approach

Continuous practice.

Strategy, design, and build held in the same conversation — from first question to shipped system.

START A CONVERSATION

Approach

Continuous practice.

Strategy, design, and build held in the same conversation — from first question to shipped system.

START A CONVERSATION

I’m Mohammad Rafat — a creative technology partner working across product design, brand systems, and Framer. I stay close to the work because the sharpest ideas arrive between the brief, the prototype, and the final build. My practice is built for teams who value clarity, momentum, and decisions that hold up in the real world.

Contra

LinkedIn

𝕏

Twitter

Dribbble

WORKING SET

Framer, Figma, Coding Agents with Agentic Stacks, Notion, and the right amount of AI — treated as instruments, not a stack.

Questions

Frequently asked.

Scope, rates, timelines, and how engagements actually run.

Ask something else

Questions

Frequently asked.

Scope, rates, timelines, and how engagements actually run.

Ask something else

Questions

Frequently asked.

Scope, rates, timelines, and how engagements actually run.

Ask something else

What services do you offer?

+

How do I start a project with you?

+

What’s your hourly rate and timeline?

+

Do you work with international clients?

+

Can I see case studies or live demos?

+

What do you need from me to start?

+

Estimate

Get a proposal in minutes.

Configure scope and timeline, see pricing update live, no back-and-forth emails.

Collaborate

Estimate

Get a proposal in minutes.

Configure scope and timeline, see pricing update live, no back-and-forth emails.

Collaborate

Estimate

Get a proposal in minutes.

Configure scope and timeline, see pricing update live, no back-and-forth emails.

Collaborate

LIVE COMPONENT SANDBOX · TEST INTERACTION BELOW

GET A QUOTATION NOW
Interactive Proposal Engine
Estimated Investment
$0
STEP 01 OF 04Core Services

Select Core Services

Choose all services required for your upcoming project.

0 Selected
DEVELOPMENT
Framer Web Development & CMS
from $1,600
DESIGN
Product Design & UI/UX
from $2,500
FULL-STACK
Full-Stack Product & Framer Build
from $3,400
BRANDING
Brand Identity & Visual System
from $1,500
AUTOMATION
AI Automations & Systems
from $1,000
ADVISORY
Creative Consultancy & Direction
from $400
Engineered with Proposal Engine · Build by Mohammad Rafat
world map

Socials

Catch Me on Internet

Building in public across platforms. Let’s connect.

View in LinkTree

Socials

Catch Me on Internet

Building in public across platforms. Let’s connect.

View in LinkTree

Socials

Catch Me on Internet

Building in public across platforms. Let’s connect.

View in LinkTree

CONTACT

If the brief has a pulse, let’s talk.

Send the outline, the uncertainty, or the half-formed idea. I’ll come prepared to make the next step clear.

CONTACT

If the brief has a pulse, let’s talk.

Send the outline, the uncertainty, or the half-formed idea. I’ll come prepared to make the next step clear.

CONTACT

If the brief has a pulse, let’s talk.

Send the outline, the uncertainty, or the half-formed idea. I’ll come prepared to make the next step clear.

SEND A MESSAGE

Schedule a Call
15-minute intro to discuss your goals, scope, and timeline.
GMT+6 (Dhaka) · US & Europe Overlap

Work

Services

Pricing

Workflow

About

FAQ

Proposal

Socials

Contact

Work

Services

Pricing

Workflow

About

FAQ

Proposal

Socials

Contact