Mohammad Rafat
Creative Tech & Design Partner | Brands via UX/Dev • Framer
Ready for work
Mohammad is ready for their next project!
Workflow Quest - An Instrument for Independents.
The Problem
Independent creators and freelancers are overwhelmed by Tool Sprawl, Dashboard Fatigue, and AI Anxiety. Late-night questions like “Am I using the right stack?” or “Is my workflow future-proof?” go unanswered because traditional audits feel like soul-crushing admin work.
The Solution
Workflow Quest transforms dry workflow auditing into a ritualistic, joyful performance — like playing a synthesizer with your operational DNA.
I designed and prototyped a fully interactive, skeuomorphic instrument inside Figma that mimics a high-end Roland JD-Xi hardware unit: desaturated dark wood chassis, physical button depth, glowing indicator LEDs, CRT screen with authentic scanlines, and Web Audio feedback.
How it works
BOOT - Power on with the big red ENGAGE button.
ROLE - Choose your primary operating profile (Designer, Developer, Founder, Marketer, Creator, Hybrid).
SEQUENCE - Build your stack by tapping up to 16 tools from categorized grids with live search. Real-time strand counter and cap enforcement.
CALC - Hit launch and watch the kernel processing sequence with a 140 BPM audio build-up.
RESULTS - Receive your Human Workflow Index (HWI), matched archetype (e.g. Digital Craftsman, Velocity Operator), estimated hourly rate (realistic & capped), and full verified tool stack.
Action Bento - Export/Share, post directly to Discord community, view Leaderboard, get personalized “Missing Strand” suggestions, market-demand insights, AI prompt copy, and leveling tips.
Standout Details Built in Figma
Complete 6-state machine with smooth transitions
Responsive mobile-first layout with locked rows for neurodivergent clarity
Interactive tool sequencer with synergy potential and hard 16-strand limit
Real-time terminal readouts and compiler-style processing log
Beautiful shareable Datacard output (example attached)
Integrated Discord community button for instant sharing & connection
Insight panels that teach optimization and combat AI anxiety
Why this matters
It turns your tool collection from a chaotic list into a visible extension of your craft and identity. It rewards intentional stacks, proves human + AI leverage, and gives creators a prestigious badge they actually want to share.
Live Prototype: https://workflow-quest.figma.site
(https://workflow-quest.figma.site)Figma Community: https://www.figma.com/community/file/1649685026382544146/workflow-quest-an-instrument-for-independents
X Post: https://x.com/mdrafat007/status/2067863323270684849?s=20
Linkedin: https://www.linkedin.com/posts/mdrafat_mohammad-rafat-mdrafat007-on-x-activity-7473629527621939201-W8jM?utm_source=share&utm_medium=member_desktop&rcm=ACoAAA2IV08BNAmBNxKdKo9nZ14s-Y0ftTR1gYs
This project is a love letter to independent builders - blending hardware nostalgia, gamification, digital wellness, and career leverage into one addictive instrument. It’s production-ready in spirit and deeply fun to use.
Extremely open to feedback from the judges and Figma community. If it resonates, I’d be thrilled to see it out in the wild helping other independents.
Built For Independents, Built For You 🔥
#ConfigMakeathon #Figma #Skeuomorphism #WorkflowDesign #CreatorEconomy #IndieHacking
7
5
487
Designed a product for Contra that doesn’t exist yet for the independents.
LevelUp from Contra University - Learn the skill. Earn the badge. Get the client. (https://contra.com/p/27rRAW2O-level-up-edtech-platform-design-for-contra-university?referralExperimentNid=DEFAULT_REFERRAL_PROGRAM&referrerUsername=mdrafat_bondz)
A free 42-day sprint that turns freelancers into verified Contra Experts.
• AI-powered personalized roadmap
• Accountability partner
• Public learning journal
• Verified Expert badge on your Contra profile
Not a mockup. A fully working prototype.
Not just a concept. A complete business case.
→ Why this makes Contra stronger
→ Why freelancers with this badge charge significantly more
→ Why this gives Contra a clear advantage over every other platform
From the memorable AI terminal animation to the full dashboard and the Learn → Earn → Active + Passive flywheel, every detail was carefully crafted to strengthen Contra’s entire ecosystem.
Would love your honest thoughts on this concept.
Detailed case study + live prototype 👇
Prototype: https://contra-university-levelup.figma.site
(https://contra-university-levelup.figma.site)Case Study: Check it out (https://contra.com/p/27rRAW2O-level-up-platform-design-for-contra-university)
#LevelUp #ContraUniversity #contralabs #ProductDesign #BuildInPublic
15
17
1.1K
Level Up Edtech Platform Design for Contra University
4
66
Submitted a #FigmaMakeathon entry around 48 hours ago!
(Absolutely! 16 seconds before the submission ended!!)
Since then:
— Featured on Contra community ✓
— Featured on the Contra homepage ✓
When you reimagine the platform and the platform itself puts you on their homepage🔥
✦ Try it: https://contra-vibe-match.figma.site
(https://contra-vibe-match.figma.site/)Much appreciated team @Contra HQ (https://contra.com/contra) & @Figma (https://contra.com/company/figma)
Next, I will be dropping the project case study soon🚀
More to come with "Contra's VIBE MATCH & TRUST SCORE" (https://on.contra.com/zBzkDR)
#FigmaMakeathon #FigmaMake #Contra
7
2
811
Introducing Contra ✦ VIBE MATCH & TRUST SCORES
Forget filters. Forget keywords. Stop scrolling through boring lists.
VIBE MATCH is a new way to discover Contra independents through feel a physics-driven constellation responding to your instincts in real time. Type "minimalist who moves fast" and watch the universe reorganize.
✦ Demo Mode: Press Space and watch the universe align.
Built with Figma Make for the #FigmaMakeathon. The meta-play: using Figma’s newest AI tool to reimagine the platform that inspired it #Contra
Experience discovery: https://contra-vibe-match.figma.site/
(https://contra-vibe-match.figma.site/)→ Tune your gravity.
#FigmaMakeathon #Contra #FigmaMake
8
24
4.7K
BONDZ FINTEC - SaaS Landing Page Design
2
23
BONDZ - AI COMPANION | SAAS | Framer Build
0
21
ADBONDZ - Creative Tech Agency
1
24
BONDZ SHOP | Digital E-com | Figma Build
0
24
Responsive Framer Hero Screen Design for ADBONDZ AGENCY
0
7
Lasagna — One Page Business Landing Website
0
7
Conceptual Website for Personal Brand Growth
1
11