@OpenAI
's GPT-4-Vision is a literal game changer. I was able to hack together this flow of doing low fidelity mock up -> actual html in like < 5 hours of the api being available. The future is bright.
For maker week at
@figmadesign
I really wanted to do something wild, so I made a plugin that runs a gameboy emulator inside of Figma and renders the output as vectors to the canvas.
Excuse me!? I just asked GPT-4 to give me a React app that looks like Facebook Messenger, supports dark mode, and communicates with the gpt-4 api and it worked? Actually blown away.
I'm dropping what is surely the biggest AI release all day! I'm open sourcing Windows 9X, which is Windows but all of the apps are ai generated. Let 9X show you itself:
I plugged gpt-4o into my windows 9X simulator. It cooks up paint.exe with multiple tools in < 10seconds. This is 100% realtime. For contrast Opus took closer to 30 seconds. This model is cracked
In case you haven't been following: I'm building Windows 9X. It is a simulacrum of an OS from the 90s but all of the apps are AI generated. Today we have a huge milestone; programs can define their own file formats and save data to the file system.
I'm really excited to show off the real reason I'm excited about widgets: pandering to 90s kid nostalgia. You can now open up Pokemon booster packs right in
@figmadesign
's FigJam. Check it out:
AI is incredible at writing code.
But that's not enough to create software. You need to set up a dev environment, install packages, configure DB, and, if lucky, deploy.
It's time to automate all this.
Announcing Replit Agent in early accessโavailable today for subscribers:
Windows9x is now here! Anyone can play with it right from their browser. Enter the description of any retro application you want and it will make it real. No matter how weird you want to get. Check below for how to get started.
After 4 incredible years today marks my final day at Figma. For the first time in my career I'm taking a big chunk of time off to travel, make music, and work on some side projects. It is super energizing to not know exactly how the next few months will unfold!
#Config2023
launches bridge the gap between design and development, all in Figma.
โ Dev Mode, a new space for developers
โ Variables
โ Advanced prototyping
โ Auto layout updates
โ Font picker
โ File browser redesign
Plus, we previewed the future of Figma with AI and
No OS is complete without a browser so I had Windows 9X make its own. My mind is blown here ๐คฏ. My simulated windows is simulating a web browser. That web browser then simulates websites.
What if you could have a personal agent inside of your browser? Ryan and I asked ourselves this question and gave ourselves a week to build it. The result: a browser extension that does what you ask. I asked it to buy toliet paper...
GPT-4-Vision is really good at reading text as well! I was able to just write some instructions in the margins of my mock and it followed them ๐คฏ. It added Javascript and make the hover states red!
I just discovered castle. This app is so fun it is like a tiktok feed of warioware games all made by other people! They have a pretty slick mobile game editor to make your own.
@shirlmeow
I feel like getting stoned, trying to bake something challenging with friends, failing, and then giving up and just eating the raw ingredients is my favorite creation group activity. There is nothing like making the best of failure to bring people together.
What if the filesystem for your fake ai generated operating system was actually real? Generating a program w/ claude -> that is written to my filesystem that I can edit in my local code editor -> that is hot reloaded in my fake os
Ok I just made this hackathon submission for pm in 4 minutes while on the muni. This is a glimpse of the future of programming. Note it is a bit on rails, you can only use python / flask / vanilla js, but it is a great start
AI is incredible at writing code.
But that's not enough to create software. You need to set up a dev environment, install packages, configure DB, and, if lucky, deploy.
It's time to automate all this.
Announcing Replit Agent in early accessโavailable today for subscribers:
I've been having the urge to make a game so I've been making a tool to help be prototype ideas and tweaking game mechanics by talking to an llm is so much fun! Stoked on the fruit ninja I made๐
Have you ever wanted to make a Figma plugin that talks to an LLM but didn't know where to start? We now have an official
@figma
plugin template that will get you up and running in minutes!
I can now reveal it! I'm going to be showing you how to write plugins for Dev Mode tomorrow at 3:15pm in room 305. Want to know how to write one of those sick code generation plugins? I got you covered ๐
Not sure if this is a known
@websim_ai
tech, but you can have it hit localhost. I've crafted a url to proxy images through stable diffusion so it can make images as well!
I never would have guessed that
@tailwindcss
would end up being the universal UI communication format with AI but it makes so much sense. All of the styling information about an element is colocated with the element and it is very concise.
I got a very rough prototype of visual programming working with FigJam widgets! ๐คฏ Excited to experiment with this more.
Heavily inspired by
@_paulshen
's โค๏ธ
@seflless
Yeah it is a custom dom format that is merging stuff from html and things we can get from the chrome debug transport. The raw html is too much context and doesn't work reliably on a lot of websites.
Someone last night asked me if Windows 9X could play Doom. I'm sorry I couldn't get it working live on stage, but I was in fact able to get it to run Doom
This was my maker week project that I honestly think is even cooler that the gameboy emulator in Figma. You can essentially write React code that renders out to FigJam!
Today we also launched a private beta for FigJam widgetsโจ
Widgets are like native FigJam objectsโsimilar to sticky notes, shapes, and connectorsโexcept theyโre custom, and built by you.
Our team came up with examples for what you might build.๐
What if
@websim_ai
itself was multiplayer? See what their cursors on the page, chat, see what pages they are on, and click in to join them! The social and imagined web.
We pair programmed the first version of this using
@code
collaborative editing. We entered this hive mind fugue state. I highly recommend that people try it. Figma isn't the only thing that has to be collaborative!
Can't wait for everyone to discover all the small interaction details and animations built into the
#FigJam
toolbar that I helped work on.
Big shoutout to the rest of the
@figmadesign
toolbar team, such a blast to work with
@keeyeny
@RobbieZhuang
@sawyerhood
I'm so excited to see my months of work in the wild! It was amazing to see what this team has built from basically a very simple prototype to this amazing product we have today.
There's not a lot of info on
@cursor_ai
's composer beta so i wanted to share an example of building out a nextjs app without ever touching a piece of code. Highly unpolished with a few hitches but its incredible to be able to build things like this.
cmd+i, forgot to say that ๐
@RobertJBye
my management chain continuously reminds me that owning goats and working at figma are not mutually exclusive but idk it doesnโt hit the same.
Do you want to play with some prompt to html fun? I just open sourced my prompt to html playground that I've been using to experiment with windows9X prompts! Tweak those prompts and let that sweet, sweet html stream in. It supports GPT / Anthropic / llama3.
pov: It is june 22nd 3:15pm. You are about to turn up for the config after party. Why don't you first join me as I teach you how to build plugins with brand new features and apis like [redacted], [redacted], and yeah even with [redacted].
The FULL Config agenda is live ๐ฅณ
With talks ranging from AI to design systems, prototyping to code, there's something for the whole product team.
Plus, weโve added new speakers.
Start planning out your day and register.
There is huge value in making a more unlocked version of Claude Artifacts. The UX is great, 10x better than alternatives. If it could use 3rd party js libraries and talk to external apis the things your could create would be insane.
If you are like me. You've probably been opening packs of Pokemon cards in FigJam all week. Your next week can be even less productive since the widget now supports Jungle and Fossil packs!
I just used Copilot WorkSpace and it actually fixed an issue? Someone requested a download button for TLBrowse, so I just made an issue and bam it was done. Only manual edit I had to make was change where the button was located.
I'm kinda surprised how Windows9X is just organically spreading through networks of Minecraft / Roblox servers. Turns out people are using it to make games!