- Plattform
- YouTube
- Länge
- 4:40
- Gesprochene Sprache
- Englisch (Vereinigte Staaten)
- Aufrufe
- 585
- Median-Schnitt
- 5.64s
- Gesicht im Bild
- 99%
- Dunkle Bilder
- 2%
Transkript von A design tool for humans and robots
Von einem Sprachmodell aus dem Ton des Films transkribiert, nicht von der Marke geschrieben. Klicke auf eine Zeile, um an diese Stelle zu springen.
- 0:00Hello, everyone. I wanted to show you a new tool that I've been working on that is called
- 0:03Efecto Studio, and it's a design tool for Vive designing, meaning that you can use an AI agent
- 0:10to design with you to be a co-designer. If you're a designer who has been using other tools for
- 0:17creating UX or UI or graphic design on the web, then this is going to be very familiar with you
- 0:23because here it has Flexbox so you can move things around if you want to, classes from Tailwind
- 0:29and other web standards.
- 0:31For example, here, I can change it to large
- 0:33or I can change it to 5XL.
- 0:35I can change all the different things
- 0:36that you would expect from a design tool.
- 0:38And for example, here you can create
- 0:40all the way to any site or any page.
- 0:43For example, this one was created by an AI agent.
- 0:46I asked it to create a page
- 0:47that was like a portfolio for Dieter Rams,
- 0:50the famous designer.
- 0:51And then it made this.
- 0:52It made all of this stuff.
- 0:54I put all the different 10 principles.
- 0:56And once it makes it,
- 0:57I can actually also edit it. That's the cool thing about this, that I can come in here and edit
- 1:02anything that I want to. If I wanted to move one of these things around, if I wanted to move the
- 1:07principles. So all of this is editable. It's just like any other design tool. But the thing is that
- 1:12it connects really well with an AI agent. And to do that, you can just go to the documentation and
- 1:18then here, copy this. And if you use Cloud Code or use Gemini or Codex or any of those AI agents,
- 1:24you can use this. So you just like copy the MCP server and then go to your terminal. And then here
- 1:29I can just paste that and then it will install the MCP server. It's already installed on my computer.
- 1:33So it just tells me like, Hey, what are you doing? But once I have that, I can come in here and just
- 1:37like open cloud code. And then I will ask it to create something new, create a website for my baby
- 1:43who is one month old and her name is Elena. Okay. So I am going to create a little website for
- 1:50Elena. So you can see that actually I forgot to tell it to use the studio. That is important. So
- 1:56use a studio. So you have to say that to use a studio and then it will create the website for
- 2:01that. So it's a studio session for Elena. And then here it created a website for me. It created a
- 2:07link where I can go and open the session. So it is opening the same file, but it's just like opening
- 2:12as a session while it's working. Now it's detecting that it is open and it's going to start putting
- 2:17the website there. So I can see that it's over here. It's just starting to put everything. So
- 2:22let me just keep this open so I can see what is happening. So you can see that it's starting to
- 2:26think. It's just starting to add the artboard. It added the little Elena Hero section. And you can
- 2:32see that it's adding all of the code and all of the code is actually just being applied in the
- 2:36design tool in real time over here. And the cool thing is that at any time, since this is just a
- 2:40design tool, I can come in here and edit anything if I want to, even while it's working, I can change
- 2:45text anything so in a way it is co-designing with you so this thing is over here the little spirit
- 2:51in the machine is just designing with you while you are also doing other stuff so i can see that
- 2:55it's been pretty good it's putting the weight of elena it's putting different milestones it's
- 3:00putting a gallery of different emojis for elena it's really nice send with love and then a little
- 3:06further that's really nice let's see if it finished yeah let me zoom in to fit there you go so it's
- 3:11in to fit so we can see the site. We have a section here. It added the hero. It added different
- 3:17sections. I can come in here and I can just like edit anything about Elenita. Also, all of this is
- 3:24responsive. You can see that it's all responsive because it's using Flexbox, it's using Grid,
- 3:29it's using Web Standards, and it's also using in the background like Tailwind and other types of
- 3:33classes like that. And also, I can come in here and copy the code. I can select an artboard and
- 3:38just like copy the code. Now it's in my clipboard and I can paste it as code anywhere, or I can go
- 3:43here to file and just like export the code and export with the tailwind that the HTML, everything.
- 3:49I'm working on making it so it exports with React components too, all the buttons and all the
- 3:54different elements you will want in a page. So it has everything that is functional. Just starting
- 3:59is still a little bit buggy, I would say, but it's getting better. By the way, if you don't have a
- 4:05terminal agent, a CLI agent, or you're not using any of that. You can also use that AI that is
- 4:11right here. That is, I call it Jules. It's Jules because one of the best designers I ever met,
- 4:16her name was Julieta. And I wanted to make the synthetic version of Julieta. So it's Jules
- 4:22AI over here. And you can just like chat with it and then you can iterate on stuff. You can
- 4:26select on things and say like, make me three more versions of it if you want to. So yeah,
- 4:31I would love to, I don't know, give it a try, see how it's going.
- 4:35Efecto.app.studio and you can just test it around.
- 4:39Thank you so much.
64 Zeilen · 1.025 Wörter
More from Sketch Together
All of Sketch Together →The rest of their work we have taken apart.
88K viewsSketch Together
hilos: a place where people and AI agents ship projects
0:5241 frames2.2s cut93% face
29K viewsSketch Together
Open Peeps - A hand-drawn illustration library.
0:3430 frames0.9s cut67% face
2K viewsSketch Together
Six Claude Code Pro Tips in 2 mins
1:5541 frames4.4s cut100% face
1K viewsSketch Together
Hilos. A place for your team and agents to make stuff
4:22142 frames17.5s cut99% face
708 viewsSketch Together
Building a design tool called Efecto
1:3234 frames6.5s cut97% face
Cut at the same speed
Films whose median shot runs closest to 5.64s.
Launch19M viewsMidjourney
Announcing a new division of Midjourney called "Midjourney Medical"
2:23199 frames5.6s cut0% face
474K viewsConcept Central
The New macOS
1:0937 frames5.6s cut0% face
392K viewsOpenAI Developers
$visualize
1:2645 frames5.6s cut87% face
65K viewsOpenAI
Make information visual with ChatGPT
1:2645 frames5.6s cut89% face
Launch273K viewsCursor
Introducing /automate, a skill for agents to set up automations for y...
0:2514 frames5.7s cut0% face
54K viewsFireCut
FireCut: Your Lightning-Fast AI Video Editor (w/ @aliabdaal)
1:4749 frames5.6s cut90% face
58 viewsHeadshotPro
Resume to LinkedIn generator
1:0425 frames5.7s cut100% face
2K viewsOFFEO
OFFEO Tutorial | Basics 17: AI-Auto Create (Updated!)
2:10110 frames5.8s cut1% face
![OFFEO Tutorial | How to [Brand] Series: NIKE](https://cdn.unfairhq.com/stealshot/frames/youtube-offeo-ek-akgba3no/intro_0002.jpg)
709 viewsOFFEO
OFFEO Tutorial | How to [Brand] Series: NIKE
2:38113 frames5.5s cut13% face
Launch2K viewshims
Do More by Knowing More: the Hims & Hers Multi-Cancer Test by Galleri®
2:00118 frames5.8s cut97% face
Launch633K viewsPerplexity
Introducing Perplexity Shopping: a one-stop solution where you can re...
1:0828 frames5.5s cut0% face
Launch76K viewsBlake Rouse
Introducing Keystroke: an n8n alternative built for Cursor, Claude Co...
1:3043 frames5.5s cut51% face
Lit and framed like this
Closest on how much of the running time has a face in it and how dark the frames are.
Launch102K viewsAdam
Introducing Silent Speech interface for your existing devices! From ...
2:43107 frames23.7s cut98% face
2K viewsAcapela
Try Acapela.com - Product Hunt Launch Video
2:26103 frames37.5s cut98% face
Launch107K viewssracha
My conversation with @im_roy_lee , founder of Cluely. 00:00 Authenti...
52:41542 frames10.3s cut100% face
Launch2.4M viewsSavannah
Announcing Astral - an AI marketer that works 24/7 to grow your start...
1:1739 frames2.2s cut100% face
52K viewsVercel
Watch a demo of deploying a Postgres database with Vercel. With our ...
3:39279 frames17.5s cut100% face
31 viewsHeadshotPro
Managed upload on HeadshotPro
2:17102 frames1.6s cut100% face
1.4M viewsMnimiy
Boris Cherny, the creator of Claude Code at Anthropic, just listed 9 ...
83:02610 frames14.9s cut99% face
320K viewsCursor
A conversation on the optimal reward for coding agents, infinite cont...
49:413581 frames5.4s cut100% face
Launch44K viewsJuan Cereigido
This is the first time Charles was using AI in his life. Introducing...
1:1429 frames35.8s cut100% face
Vercel
Keynote Interview: Vercel's Guillermo Rauch on the Agent Era | Azure Cosmos DB Conf 2026
9:4873 frames99% face
740K viewsAnthropic
In her first Ask Me Anything, @amandaaskell answers your philosophica...
36:092498 frames8.3s cut99% face
165K viewsAnthropic
Join Anthropic interpretability researchers @thebasepoint, @mlpowered...
59:023939 frames15.2s cut100% face
More social
Same category, other makers, most watched first.
622M viewsBase44
Your ideas, your apps—Base44
0:5651 frames1.1s cut6% face
538M viewsBase44
Turn any idea into an app with Base44
0:5538 frames2.2s cut50% face
154M viewsBase44
Build Your Website with One Sentence | Base44
0:4835 frames0.9s cut31% face
81M viewsNike Football
Rip The Script | Nike Football
6:00310 frames1.1s cut60% face
75M viewsPetSmart
PetSmart | "Pickup in...STORE!"
0:1511 frames1.4s cut64% face
69M views1X
NEO The Home Robot Order Today
9:53271 frames2.8s cut25% face
69M viewsApple
Apple Education: Ready for every learning opportunity
1:4687 frames1.3s cut40% face
64M viewsBland
Phone calls suck. So, we bought a giant telephone car, raised $65,00...
1:4854 frames4.3s cut81% face
39M viewsFigma
Oh wait there’s more: we’re building 3D Transforms, here’s a preview ...
1:0423 frames4.0s cut78% face
36M viewshims
Getting Help is Simple, With Hims
0:3023 frames2.0s cut70% face
36M viewsFigma
Made in Figma (2025) Like this ❤️ we designed it for you
0:3872 frames0.5s cut7% face
35M viewsApple
Hello, MacBook Neo
3:50291 frames67.5s cut1% face