Freelancers using FlowstepFreelancers using Flowstep
Product Designer for AI & Interactive Products
14
Followers
Product Designer for AI & Interactive Products
Cover image for I realized recently that I
I realized recently that I couldn't find some of my oldest childhood friends online. Instagram handles change, Facebook feels like a ghost town, and the internet,despite connecting the whole world,somehow forgot about the class of 2012. So, I decided to build a place for us. The Solution: Meet Catalog. A mobile MVP designed not as a noisy social network, but as a quiet sanctuary. No endless feeds, no gamification. Just a calm, nostalgic space (built with a strict Notion & Daylio-inspired design system) to find your old school, claim your class, and share memories. The "Messy Middle" (How I built it): For the challenge, I didn't just want to drag and drop. I wanted to push the technical limits: The Architecture: I used for the first time the Model Context Protocol (MCP) via Cursor (first time too) to inject a strict design system directly into #Flowstep using prompt engineering. The Reality: Building is messy! As you can see in my demo video, my laptop battery almost LITERALLY died mid-generation, and the AI created some duplicate branches. But that’s the beauty of being a Product Engineer. I jumped into the Flowstep canvas, cleaned the architecture, exported the native layers into Figma, and manually wired the final prototype to perfection. What's Next & Let's Connect: This UI prototype is just the beginning. With my background in Software Engineering and Data Science, I am going to build the real backend for this. To ensure safety, I plan to integrate an OAuth verification system (like Instagram API) so users can securely verify their identities before seeing sensitive contact info. I want to see this project come alive so I can finally find my long-lost friends, and I hope it helps you find yours, too. Want to collaborate on making this real?I will make this a study-case on my blog where you can see more updates or reach out Flowstep link:https://app.flowstep.ai/file?activeFileId=df531572-26cc-49ef-986a-40cbbf6bbee5 Social post (instagram) link: https://www.instagram.com/reel/DbewKGCICBv/?igsh=MTc4a2NvMjhma3c2ZA== Personal page: https://garrulous-build-logic-flow.base44.app/
1
212
Cover image for Hei again! Just wanted to
Hei again! Just wanted to post a quick update on "Catalog" — my project for finding those long-lost middle school friends. I just recorded a demo to show the "messy middle" of my workflow. Since my goal is to eventually bring this to life with my software engineering background, I really wanted to push the technical side of this challenge. I used the Flowstep MCP integration in Cursor to inject a strict, calm design system directly into the canvas. I want this app to feel nostalgic and safe, not like a noisy, complicated social media feed. Of course, building is never perfect on the first try! The AI got a bit too excited and over-delivered by creating a few duplicate flow screens. So, I jumped into the Flowstep canvas, cleaned up the architecture, and then exported all the native layers straight into Figma. Now, all the connections are manually wired up and you can see the fully clickable flow working beautifully on an iPhone 14 demo! Also, thinking ahead about how this would actually function in the real world: safety is the biggest hurdle. In the video, I talk a bit about the product vision. To make this safe, the real backend would use an API integration (like Instagram OAuth) to verify someone's identity before revealing any sensitive contact details or phone numbers. It's the only way to make sure you are actually talking to your old desk mate. It's almost 6 AM here and I’ve been up all night building this, but seeing the prototype finally come alive and clickable in Figma makes it all worth it. I'm going to get a few hours of sleep and then I'll post the official final submission later today. Hope you guys like the demo so far! Flowstep link: https://app.flowstep.ai/file?activeFileId=df531572-26cc-49ef-986a-40cbbf6bbee5
2
281
I turn social strategy + UGC into *actual* revenue
$10k+
Earned
18x
Hired
5.0
Rating
406
Followers
I turn social strategy + UGC into *actual* revenue
Cover image for As a marketer and business
As a marketer and business owner, I know one thing: in 2026, if your business doesn't have both a website and at least one social platform, it feels a bit sus... 😒 That’s why for this challenge it took me less than a minute to choose my favorite local spot: Coffee Village, an eclectic, quirky coffee shop in Palmela that serves the most amazing cappuccinos and cheesecakes 🤤 But...despite their incredible charm and delicious treats, their online presence wasn't doing them justice - hence why I decided to give them the digital home they deserve ✨ 🟥 BEFORE BASE44 They had no website whatsoever, and their custom cake orders were completely scattered across a landline phone, Facebook messages, and Instagram DMs. Managing this during holiday rushes like Christmas and Easter must've been CRAZY 😵‍💫 🟩 AFTER BASE44 I built a fully responsive, bilingual (PT/EN) website that both reflects their unique decor - including their signature wall stripes and dark wood tables - and speaks directly to the audience they're trying to attract! You can see it for yourself 👉 https://coffeevillage.base44.app As for that cake order situation...that's where the automation came in! I built a streamlined cake order system, so customers can submit their orders in one centralized place. The backend workflow automatically: 👉 Triggers an instant email confirmation to the customer. 👉 Sends a structured email summary directly to the owner. I'm handing the site over to the owner tomorrow and can't wait to see their reaction!!! Next up on my to-do list? Bringing my professional camera to the shop to shoot even better photos and videos for them, both of the space and the food & drinks! Here's to helping local businesses glow! 🥂
3
8
709
Product Designer | Full-stack Developer
$1k+
Earned
2x
Hired
5.0
Rating
59
Followers
Product Designer | Full-stack Developer
Branding & Framer sites for founders who stand out.
$10k+
Earned
1x
Hired
5.0
Rating
124
Followers
Branding & Framer sites for founders who stand out.
Cover image for Introducing KEEPS: A Digital Home
Introducing KEEPS: A Digital Home for Physical Memories KEEPS is a mobile app designed to preserve the physical objects that carry our memories. While most memory apps are built around photos, KEEPS is built around everything else. Concert tickets, boarding passes, receipts, handwritten notes, invitations, conference badges, and other small objects that people often keep long after their practical purpose has ended. The idea came from a simple observation: many of us keep these items because they represent experiences, relationships, milestones, and moments we don’t want to forget. Over time, they become scattered across drawers, wallets, books, and boxes, making them difficult to revisit and easy to lose. KEEPS transforms these physical keepsakes into digital artifacts. Users can scan real objects, remove backgrounds, add contextual information such as location, date, people, and personal notes, and organize them into custom collections. Artifacts can also be created from templates, allowing users to recreate memories that no longer exist physically. The prototype includes onboarding, collections, artifact detail pages, discovery flows, creation flows, profile experiences, and a connected navigation system that allows users to move through their archive naturally. Rather than generating the entire product in a single prompt, I used Flowstep as a design engineering tool. I started with a visual direction created in Figma, including custom illustrations, typography, layout systems, and the overall structure. From there, I rebuilt the product inside Flowstep screen by screen, using detailed prompts to define hierarchy, spacing, interactions, navigation patterns, and user flows. Each screen became the foundation for the next. Existing components were reused, refined, and expanded to create a cohesive design system across the entire application. The process was highly iterative: generating, reviewing, refining, and rebuilding until the product felt consistent both visually and functionally. The result is not simply a collection of screens, but a connected prototype with clear user journeys, interaction logic, and product intent. KEEPS is built around a simple belief: The smallest objects often carry the biggest memories. Flowstep file link: https://app.flowstep.ai/file?activeFileId=cb23715a-64af-4fb6-822a-c789fb99b461 X Post: https://x.com/webdesign_alice/status/2081713836613050543?s=46&t=1ZFswUtJzT6BPLQaoOweGw The walkthrough, screen recording of the prototype working in Flowstep, my custom illustrations, and the screens designed in Flowstep are included below.
51
94
3.6K
Cover image for Interactive Web Utility Tool: Explore Omma's Dissolve Builda...
Excited to share my submission for this Omma buildathon: Dissolve  Live link: https://omma.build/p/dissolve-zak2ob Dissolve is an interactive, creative web utility tool built entirely on the Omma platform. The concept is centered around dynamic deconstruction, giving users the power to dissolve visual media in real-time. Built 100% in Omma Omma Studio: Used to generate the custom, smooth polymer pink arch mascot card acting as the application’s flagship visual asset. Omma Canvas: The entire product architecture, interactive state management, responsive grid layouts, custom slider controls, multi-format file exporters, and cursor-tracking mouse-tilt vectors were engineered natively inside Canvas. Effects Pixel: Transforms images into highly customizable pixel grids. You can adjust the block size, pixel shape, colors, and layouts, all paired with animated motion. Dither: Converts images into retro, ink-and-paper dot patterns, featuring live-animated drifting and shimmering fields. ASCII: Maps image brightness to text characters in real time. Features customizable character sets, boxed layouts, and live text animations. Particle: Explodes images into interactive, physics-based particle fields that react to your cursor and snap back into place. Crucially, this effect can be exported as self-contained, working HTML or TSX code. Imports that give you freedom: Dissolve isn’t limited to the default mascot placeholder. You can upload your own image or video and the effect engines will rebuild themselves around it instantly.  Upload an MP4 and the effects run live on the video frames: the pixel grid, dither dots, and ASCII characters all recalculate in real time as the video plays.  You can also upload a custom background image for Pixel, Dither, and ASCII: it sits behind the effect layer, composited directly on the canvas. Every import is local and sandboxed, nothing leaves your browser. The export system was built with intention: Static effects export as PNG or JPG at ×1 to ×4 resolution. PNG is transparent when no background is set; with a background, the full canvas is included.  When a video is uploaded or animation is enabled, exports switch to GIF and MP4. The Particle effect exports as a self-contained HTML file or TSX component with all settings and physics baked in, fully responsive to any screen size.  X Post: https://x.com/webdesign_alice/status/2072697112840577441?s=46&t=1ZFswUtJzT6BPLQaoOweGw Try it out and feel free to comment your creations below! 
2
5
408
Cover image for For the Squarespace Challenge, I
For the Squarespace Challenge, I built DAWN. DAWN is a conceptual portfolio for photographer Christopher Dawn built around a simple idea: photography should speak for itself. Website: https://maroon-sepia-dl3n.squarespace.com/ Password: DAWN Today, many creative portfolios compete for attention through excessive copy, interactions, and visual complexity. DAWN explores the opposite approach: a photography-first experience designed to remove friction between the viewer and the work. Rather than overwhelming visitors with information, the website focuses on what matters most when choosing a photographer: the images and the creative vision behind them. As part of the challenge, I joined Squarespace Circle to continue exploring how thoughtful, professional-grade design tools can help bring creative ideas to life. The project was designed around three principles: restraint, intentionality, and curation. Photography occupies the majority of the experience, supported by generous whitespace, minimalist typography, and editorial-inspired compositions. Every element was intentionally reduced to allow the work itself to become the primary storytelling medium. Inspired by contemporary editorial design and luxury fashion websites, DAWN feels closer to visiting a curated gallery than browsing a traditional portfolio. Using Finish Layer Finish Layer’s scroll animations became the foundation of the experience. Rather than using animation as decoration, they were used as tools for pacing, storytelling, and curation. One of the core ideas behind DAWN was that design decisions should always serve a purpose: including the tools used to build it. Finish Layer was never used simply for the sake of using it. Instead of incorporating every available feature, I intentionally chose the ones that best supported the concept and user experience of the project. Throughout the portfolio, photographs progressively reveal themselves and transition from isolated moments into carefully curated editorial compositions. Images begin small and gradually expand into editorial-inspired layouts as the user scrolls, creating visual rhythm, establishing hierarchy, and encouraging visitors to engage with each image before experiencing the collection as a whole. At the end of the website, Finish Layer is used to create a playful scroll-driven interaction that acts as Christopher’s introduction. As visitors continue scrolling, a series of hand-drawn elements are progressively revealed: a speech bubble, a camera, a camera flash, and finally a simple “Gotcha!” message. The sequence serves as Christopher’s personal introduction, presented in an unconventional and playful way. What appears to be a simple interaction is, in reality, a carefully choreographed scroll-driven experience designed to reveal personality through restraint. Animation is deliberately subtle and purposeful. Every transition was designed to support the photography rather than compete with it, demonstrating how Finish Layer can be used to create immersive storytelling through restraint rather than complexity. Every interaction throughout DAWN was designed to feel effortless. By embracing restraint and using Finish Layer intentionally, the project demonstrates that immersive and memorable digital experiences do not need to rely on complexity. Sometimes, thoughtful pacing, generous whitespace, and meaningful interactions are all that’s needed to let great work speak for itself. DAWN explores the idea that thoughtful design isn’t always about adding more: it is equally about knowing what to leave out. By combining editorial-inspired layouts, generous whitespace, and purposeful scroll-driven storytelling, the project demonstrates how a photography portfolio can feel immersive, playful, and highly curated while remaining remarkably simple.
14
894
Landing Page Expert
$1k+
Earned
1x
Hired
121
Followers
Landing Page Expert
Cover image for I chose PRYZM, a real
I chose PRYZM, a real AI background generator that already had a solid concept but lacked personality, discoverability, and an engaging creative experience. Before: https://www.pryzm.design/ (https://www.pryzm.design/)After: https://tremendous-lumen-art-lab.base44.app/ (https://tremendous-lumen-art-lab.base44.app/) (You'll notice the logo is intentionally removed in my version. That's to avoid any copyright issues not a missing asset ) Instead of redesigning just the UI, I completely reimagined the experience into an interactive AI creative studio. ✨ What I built: - 3 dedicated creative builders: Social Media / Portfolio /AI Image Mixing - Each builder has its own custom workflow and tools designed for that specific use case. - Unlimited AI background generation: Generate backgrounds manually or instantly with Randomize. - AI-powered animated experience: Both landing page backgrounds are AI-generated and animated. Even the custom cursor is AI-generated and animated. (If anyone wants the prompts I used for the backgrounds , just let me know in the comments.) ✨ Creators can: - Share their work publicly or privately - Explore creations from the community - Remix any background in seconds - Export as image or video in custom resolutions ✨ Automation: I implemented an AI-powered onboarding flow that personalizes the experience from the very beginning. Users answer a quick interactive quiz and are automatically taken to the builder that best matches their creative goal, making the app faster and easier to use. ✨My goal: I wanted to transform PRYZM from a simple background generator into a product people genuinely enjoy spending time in....not just generating assets, but discovering, creating, remixing, and sharing them. Now it's your turn. Create something amazing and share it in the comments 💛
34
53
2.5K
Building interactive framer & shopify sites for startups.
5.0
Rating
40
Followers
Building interactive framer & shopify sites for startups.
Creative Technologist at 1.777 Studio
$5k+
Earned
114
Followers
Creative Technologist at 1.777 Studio