Smash Notes

Y Combinator · Notes

Full Transcript for The New Full-Stack Designer

People

Get the key moments without reading the whole transcript

  1. Does AI Know What Looks Good?0:27
  2. Why Are Prototypes More Useful Than a Product Requirements Document?14:05
  3. How Does Figma Help Codex Build Motion?19:43
  4. Why Are Designers Becoming Full-stack?25:41
  5. What Is the Design Tool Dialkit?26:52
  6. What Is a Website's One Primary Goal?33:03
  7. Why Put Important Content High on a Homepage?49:32
  8. Why Do Two Changing Headline Words Confuse Visitors?52:40
  9. Why Is Smooth Scrolling Bad for Websites?56:22
  10. What Is Blossom Carousel?1:04:01

Episode page

Full transcript

Today, I'm joined by Marvin Schweibold, who leads the Product Design Studio at Shopify. He'll give us a behind-the-scenes look at his process, where we'll see how he's using the latest AI tools to bring his designs to life, then review some viewer-submitted websites. Welcome to another episode of Design Review.

Marvin, thanks for joining us. Thank you for having me. Before we get into your work at Shopify, I'd love to hear more about your process and the tools that you're using today to design with AI. I feel like the process itself hasn't really changed. It's still extremely iterative and sequenced out. There's a lot of iterations and variations in the work in and of itself, but the tooling has definitely shifted a lot from tools like Figma and working with aesthetic layouts into more of an AI-driven process.

workflow where I'll use Figma as a scratch pad for some of the ideas I have, but then very quickly that'll transcend into real demos that I can use. And then I only piggyback back into Figma from time to time if I need to lay something out or explain something to AI. But it's definitely more of a world now that includes tools like Codex and Cloud Code and and being in terminal a lot and just getting to an output that I can use and test on my phone or computer a lot faster.

And that becomes like a really fun, still very iterative cycle, but we've definitely moved away from the canvas more to like AI tools in general. And how much of that workflow is AI driving a lot of the process and how much of it is you the human? I think it's a lot of me, the human driving AI to do a lot of the heavy lifting for me. But there's a lot of quality controls, decision making that are all up to the designers.

We're in the driving seat and we're actually more than ever now in a position where the output isn't the issue anymore. It's us being extremely selective about what we go forward with. and what we work with. So it's a lot more curating what AI is creating. And that is a continuous like just back and forth with AI. I feel like AI is extremely capable of getting a lot of things done that we needed to do.

As long as you understand the complexity of what it is that you're working on and you're able to break that down into into a multitude of almost like subtasks that then you can feed to the agent bit by bit. And then it's a back and forth. And it sounds like a lot of what you're describing is that your role is actually to be the editor. We're more the editors now than ever before, which is, I think, fun.

That's great. I mean, that was always the role, but getting to the point of editing just took a lot of like handcrafted design that we would do in Figma. And just more and more of that can be now sped up and extrapolated with AI tooling. And so you, the human, are still responsible for the ultimate final output and making sure that it meets your bar.

Always. But you have all these tools now to be able to get there way faster. 100%. I mean, AI has definitely raised the ceiling for all of us, but it's not a crafter. It can... execute complexity and technology that I couldn't hand write code. It can write code, but it doesn't know what looks good and what looks bad. And that's for me to decide and to steer AI into the right direction.

I've been a big fan of your work for a long time. So maybe first just start off and tell us about the product design studio at Shopify and what you guys do there. I work with a team of very talented designers. We've been there for the last year. And between us, we basically run an initiative at the company to redesign and touch the most important surfaces we have.

So from anything related to Sidekiq, which is our AI infrastructure layers that basically manage our entire admin, to the mobile app, which we call the green app, And everything from admin and admin dashboards we look at and work with. Quite recently have been working with a lot of new AI infrastructure that the engineering teams have built for us.

And yeah, it's just been a really exciting last year. Yeah, it's actually really interesting because Shopify is like two decades old or something at this point, right? 20 years old. 20 years old. And so we are in a new era now where AI is changing a lot of things. And it sounds like a lot of the work that you're doing is actually to modernize and bring it into a modern era, which is through design, but also the experience itself, right? What does the design team and your product design studio actually work on there? Are you just in Figma and canvases and designs and passing them off to engineers? Or what is the design function like that you manage there? At least at the

moment, there's almost like two parts of this big initiative that we're taking. Part of the organization of the design team has redesigned the entire admin experience. This redesign starts in Figma and with polishing interfaces and bringing that into the web. And the other part of the organization, the sidekick team of Shopify, is working on automating and manipulating a lot of the Shopify interfaces via the chat.

so that you can use Chat, Sidekick, or AI Infra to basically manage your store and automate a lot of what it means to be a merchant online. And that's like, they're basically two almost controversial, paradoxic sectors of the company, but they work really well together. So you're building really beautiful new UI, but you're also using new UI to basically generate AI infra and AI workflows.

And that's incredible to see. And a lot of that actually translates very nicely back into the mobile app and is up-leveling the mobile experience as well. It's a lot more conversational and a lot more talking to sidekick about your business than having to manipulate your business via the interface. Yep. And previously, before joining Shopify, you were building your own product studio with Molly.

And you have incredible motion and animations and interactions there that I always found to be really inspiring. And maybe you can show us some of that and talk through where that came from. Molly was a studio, a design studio in Brooklyn that I was running together with JTel, my studio partner. We ran the studio for about two years before joining Shopify and integrating the studio into Shopify.

And you had some huge clients that you worked with during that time. Yeah, we worked a lot with Collins and Apple and Google and also a lot of smaller clients too. It was honestly a broad mix of web design and product design and a lot of content strategy and hierarchy for clients as well when it came to their websites. Because we were a small studio, it also allowed us to have extremely close relationships with our clients.

We would meet clients weekly for many weeks and use these projects at MOLLE as very high-focus stints with these clients. So we never took on more than two or three clients at a time to stay really focused. Here's just a reel of some of the work we were doing

while we were running our studio. It's so cool. There's little details here. The animations are very organic. Yeah. And even as each screen changes, the gradient and the shadow behind it changes to match the color of the background that I think a lot of people maybe wouldn't pick up on But it's something that you sort of intuitively feel that something is happening here, right? We got this idea basically just from the ambient lighting behind TVs that are mounted on walls.

And I think JTAL, and this was pre-AI, basically duplicated the video and had it blurred out in the background so that it would match the rhythm of what's going on on the screen. Uh, and it, and it works really nice. And I think what we, but before the sentence, it used to just say, Molly is a design studio in Brooklyn. And there was just the gradient at the bottom that was kind of like vibrating.

It feels like a thunder or something. And it kind of, at least for us, it always felt like people were like inclined to scroll into it. So we didn't even have to show them any of the work, but we kind of hinted at it. Um, and then you scrolled into the real and, um, Yeah, the rest are just very nice and simple carousels. But yeah, you can see here, this was some of the work we were doing with our studio.

And I think some of the patterns you were referring to,

we used to call the system what we call the system primal. It's a way to just basically... understand content on a website, digest content on a website. And for us, it was a very structured way of digesting. When clients came to us with a lot of information for their websites, we helped them build that into a system on the website that allowed users to explore.

To us, it always felt like the way we would build websites and you would flow through the website felt more like you were exploring the website than the website was demanding your attention. Everything is just one layer away and everything is progressively disclosed. So you never overwhelm the user with too much content in general. What are some of the ways that you accomplish that? I mean, I can just go through some of the work.

This was a project we did with the agency Collins. We worked with them for, I think, over a year on this website. And as you can see, even as you're scrolling through the homepage here, each section of the homepage is a chapter that as you... as you interact with the website can lead you into further exploration. So this is one of my favorite sections here.

This is the bookshelf. These are basically all of the case studies from Collins. Even go back and hover over those elements again. The way they bounce feels different than what you typically see. Yeah. Talk about how you made that. This was, you didn't use AI tooling to do this. You handcrafted these, right? Yes. Well, in this case, I will say this was very much design and engineering partnered together.

I would lay something like this out in Figma and try to understand the spacing and the size and the colors and the rows and all of that. And then I would hand it off to someone like Jesper who would then work on the bounce animation, for instance. All these books have to level up on top of each other and then basically land one more time as the last book kind of lands on top of it.

And that has to feel very organic because if that feels bouncy and organic, then it deludes at the idea of, oh, it's a book, it's a bookshelf, that's alive. And those things, I think while they are seemingly unimportant, are exactly the kind of little moments people pick up. when they scroll through these kind of websites. Why does that matter? You have a person who's supremely talented, whose entire job on this project was to make the tab interaction.

And it's very easy for anybody to go, well, just throw a tab. Tabs exist. You can get that for free in five seconds and then move on to the next thing. Why did you feel like it was important enough to spend somebody's dedicated time, before AI could do this, certainly,

and have them focus just on that one interaction? There's multiple different ways to answer that, but I think especially for this studio, because they work on design themselves, like this is a branding studio, I think the clients coming to the website are looking for those kind of Easter eggs. They want to know that if I hire this agency or if this agency takes this much detail to produce a website of that quality, what kind of Easter eggs that they're going to put into our projects when we work with them.

And when they pick our color palette, maybe they're going to come up with a system behind it rather than just picking five colors that they like, because that's the level of dedication it takes to go really deep. It's a way to, in a way, almost also to show off and show the level of craft and detail that you can bring to any piece of, or any part of the interface.

We try to do the same level of care and craft at Shopify. Talk about the decision then to sell your design studio to Shopify and to come join them and how that process has been different for you being at a large public company and leading a product studio internal there versus the work that you were doing here when you were independent. Toby at some point last year basically said, we're entering a new era and that future needs to be designed.

And that was basically it. He's like, I want to design for the future and I need to hire good designers who can help me paint a picture. And when we see that picture, we'll know what it is and we can... We can go down that route. And I think that was the, that's the mandate at Shopify. Like design is very much more in the foreground. It's a very honest organization.

That's very self-aware. It's a founder led engineering led organization. Um, and design hasn't always played the role that it's playing now. Design is very much helping shape the narrative of where the company is going. and the level of craft and pride we're taking towards the tooling and the software that we're building for our merchants.

And that's beautiful to see. And that was one of the reasons we wanted to join because we felt while we were having fun designing websites for other studios like Collins or Spencer the Illustrator, we also wanted to have a larger impact and see if our strategy would hold up on interface paradigms with millions of users versus the few users, I guess, that would scroll around the Spencer website.

MARK MANDELMAN- Right. And so it's a different set of challenges. A lot of the Design Studio work that you did was create a new site or something to display work or work on a product or something like that. Talk about how it's different now. Shopify has millions of users and there's a lot of money at stake with every design decision and interaction that you work on.

And what is your process like now being this internal design studio and how do you interface with the rest of the organization and how do you interface with users especially too? So I will say basically for now, our studio exclusively operates within Sidekick, which is the AI infrastructure layer of Shopify. The whole team works extremely close with the rest of the design organization.

And it's a very beautiful interplay, which is, I think, in general, how these studios work or how this works more successfully. I've been in positions in also previous careers where if you're more isolated, it's always more difficult to... ingest into the company and have a large impact in the company. I think at the moment we're very ingrained in the current workflows and ingrained in the timelines and in our roadmap.

And it requires a lot of experimentation. Honestly, like up-leveling the interface was easy for us because we have really talented designers who rebuild parts of the interface in Figma and then using AI, we're able to port that over into very tangible prototypes extremely quickly. And as we all know, prototypes are a million times more useful than any PRD document you can write.

Those spread around the company like wildfire. And if Toby sees a prototype that he likes, then we can go off and build that. And I feel with some of the AI mutations work we've been looking at at Shopify. We can show some of that later. It feels the same. We have ideas in our head and it's extremely easy for us right now using the current technology to just simulate it all and generate prototypes.

Where in the past, at MOLLE, a lot of the work we were doing was by hand. Our sheets were designed by hand. All the animations were done by our developers. Art direction might have been my idea, but other than that, there's like a thousand counterparts that you have to interact with. Right now, I'm seeing one-off armies or teams of two going off and doing the work of many because the tooling is just allowing us to do that.

And that's making it a lot easier to get buy-in because I can show up with a prototype and get people's attention faster than I can if I have an idea and I have to get a whole team rallied around an idea. Could you show us some of the work that you guys have been building at Shopify? This is basically a redesign and facelift of our current admin experience with a new home design and an overall facelift of basically the entire product.

which we've been working on at the moment. I think one of the more interesting things that we've been exploring right now is just how psychic and the merchant interact with each other. We have this concept of psychic suggestions on the home feed. These suggestions are brought to the merchant by us. We've identified opportunities and benefits that the merchant could do inside of their ecosystem, inside of their universe.

And we can show those to the user. And then as the user interacts with these suggestions, we basically kick off a conversation with Sidekiq we can directly manipulate the admin dashboard for the user and we can show those changes to a user. So we're showing a user right here, we think you should rewrite the description of your product. Here's the suggestion that we think you should do.

You can publish these changes and basically through a conversation with Sidekiq, you've directly manipulated your store. And the concept is more, can we bring UI to the user and into context versus having the user click through the interface. At the end of the day,

There's a world where a merchant can spend a lot more time on the home surface and use Shopify as a dashboard to delegate and interact with Sidekiq and have Sidekiq directly manipulate the store. Right now, what you're looking at is still a prototype environment. There's a DevUI panel inside here. And basically, we're building all of these the design team is building all of these changes and demos

and ideas right into the interface here. So we can just test and build on top of it. And it's become this beautiful process where once a demo is at a point where we kind of all align, everybody branches off and builds a version of something that they think that brings value. And then we all come back together and it actually lives all inside the same demo and the same link.

And it's just a beautiful way to share ideas and context. You said designers are building this in here. A lot of times designers are designing. And they're not building, but it's in Shopify and your team and you, you are building a lot of the stuff that you are designing so that you can test it, so you can prototype it, so you can see it on live data, live experiences.

And that's a huge part of nailing it and building something useful and making sure that it's great. What was your evolution from designing in Figma to now you are not just designing, but you're actually creating it out into the world to be able to test it and doing that full loop yourself? In this specific case, admin has a playground that we build.

Instead of that playground, we test. That's not production code, and that wouldn't be allowed back into the main GitHub repo of Shopify, into our main repository. Having said that, though, AI has definitely gotten to the point now where, as designers, we are highly empowered and capable to visualize any idea that we want to get our idea across.

In a previous world, that just wasn't possible. We looked at the Collins website earlier. A lot of that work, In Figma, when we worked on it, it still looks like this. You can zoom into any part here. And there are highly detailed Figma screens that we're designing through. And this is an ideation process. I think this is a mixture of me, Michael Speichert, and Jay Tal working on this project together.

And you can just see the evolution of as we're going through ideas and trying out new things. These are too heavy and too expensive to test and code. We don't want to test this...

in code right now because it would require an engineer to take a look at it and build it for us. So we tested all in Figma. Figma is the playground and the world we were building everything in. We were building it on desktop and then we were translating it to mobile. And all of this had to be stress tested out in Figma first for a very long time before we would go and bug the engineering team.

A lot of the way I'm talking to AI or I'm still using Figma at the moment is I can get really far with a very broad sketch. Here's an example of a side project I've been working on over the weekend, which I can go into detail a bit. But one of the things I wanted to build out for this project was a two by three overview of these grass studies and these videos I took.

And the interaction here is you can open up any one of these videos and you can drag down to close them. And it works the same in the simulator.

I explained this, I described this to AI and I was working in Codex and Codex built this out for me. But the interaction wasn't interruptible. So every time I clicked on an asset and pulled it down, I had to wait until the asset was all the way back in its position and sat down before I was able to tap on another image. And that's just not how you want to use this pattern.

This has to be very responsive very quickly, otherwise you'll get very annoyed with the interface very fast. So I just went into, into Figma and kind of drew out very rudimentary, simple boxes. Like when, when you click on the box, red comes up, you can swipe it away. If as you're swiping away, you click on blue, blue now comes up and you can click that away and you do it with green.

And I think that's just like a good example of, of, of how at least myself personally, I'm, I'm using, I'm, I'm using Figma more. Um, it's more a scratch pad to like map out ideas. And I give those ideas to Codex. And I use the Scratchpad A because it's easier for me to decompile something, but also it's actually easy for Codex to decompile it if it sees it visually.

It interprets that image, I think, similar to how I interpreted it. At least it understood what I was doing and how I was thinking about the motion. I couldn't articulate it via text or voice. but I could draw it out. There's two parts of this that I think are important to call out. I think number one, Codex and all the current AI software and the models are extremely capable at creating anything.

You can use these tools to make anything that you want, but you have to know what you're doing and you have to be able to take a concept or something more complicated like the shader and break it down into all its little components. You have to be able to understand those components and then you can put those components back together. Yeah.

Just show us how you did that here. Cause so to be clear, you had a bunch of images and videos and videos of, of actual grass. Yeah. And then you wanted to create a shader that looked identical to that, but you could control and function like a shader. And so talk about how, like the different elements and what you had to go through to actually get that to look lifelike.

I have a few screenshots here. Again, this is a good example of how I use Figma. So I fed the video into Codex for the first time and just explained the project and the process that I wanted to go through. Take the video, turn this into a shader. I want the shader running in the web. And I want you to be as meticulous as you can, be very pixel perfect, grab all the colors, make sure that you're using the same hex codes, understand each part of the image, and then try to recreate that.

And it went off and said, no problem. I got you. And it came up with this, which obviously doesn't look at all where we landed, where we ended up now. But then the process from here was I would screenshot this and my original video. I would open up ChatGPT and I gave it to another agent there. I explained that agent exactly what I was doing as well.

I said, why is the other agent not understanding what I'm trying to get to? And that... ChatGPT then helped me kind of like understand my own process. Like, well, you have to explain to it where the light is coming from and what shadows you're using and maybe break the image actually down into like six parts and have it do each one of those individually and put that back together.

And as I was kind of thinking about all of these different things, like I was trying to come up with how could I become very clear with AI and explain to it exactly what it was actually looking at. So one of the tricks I used was I went into ChatGPT and I had it render basically a topographical map of the underlying structure. AI, as I was going through this, it was kind of getting closer and you could see that it was painting more pixels into the grass plates.

And these started to look like bushels a little bit, which felt more realistic. And then over here, I was like, okay, we're getting somewhere here now. This doesn't look terrible anymore. But I kind of figured out it doesn't understand that it's not a flat layer. underneath. These are little hills. Basically, I fed this back into AI and it understood, oh, okay, so there's an underlying structure in a map that has different depths and heights.

And if I can re-render the grass on top of that infrastructure or that structure in general, it'll be much easier for me to create the scene. And that kind of worked really well. And in this prototype, for instance, there's a binary toggle to turn the grass on or off. And you can actually play with the terrain quite a bit here as well. Right.

This was all unlocked via Josh to me at a lunch the other day where he kind of like, we installed Dial Kit into this demo because he looked at this and he's like, this looks pretty good, but you should look at the length of the grass blades. And I was like, Whoa, okay, that's true. So I asked Codex, like, hey, how many grass blade variations do we have? And it said, we have about 217,000 different grass blades, but they only differ by like 0.6, 0.7, 0.8.

So we were like, okay, let's just build a toggle for it so that we can see it ourselves. I don't want to have to go back and forth with the interface and chat about this. Expose the underlying structure Exposing the underlying structure would also show me where AI had made mistakes. The original version of the terrain map that it had implemented was completely wrong and skewed.

So I couldn't get to my outcome anyway because AI had misinterpreted something five prompts ago that I didn't know about anyway. Dalek had kind of unpacked that for me. But then in general, you can just mess with a few of these values and they kind of help like bring some of this, like they help visualize what I really wanted to see. And if, you know, the length here is longer and then you can...

You can introduce more wind. This was something I wanted to test and see how crazy I could get with the wind movement. You can see it gets a little wild. But I think this is just a small example of a little bit of like... a fun project just to try and see how far can you get with the tools. And these are things that I think before AI, I couldn't do.

I might have had these ideas, but I wasn't allowed or able to execute on them. And I think that's just in general what's changing with the design role right now. Anyway, like it's, it's, it's designers are becoming more full stack as our engineers and PMs. It goes, it goes, it goes in every which way. There's no limitations now. Right. And actually this is one of the, uh, one of the common patterns that we've been seeing a lot creating prototypes and then creating a little widgets that allow you to control different variables in them to, to be able to test it really easily and get it right.

Yeah. And previously it wouldn't have been worth anybody's time to do that. You would just, you know, maybe play with variables in code or something until you got it and then you'd call it good. And that would take way longer or you wouldn't even spend the time doing it. Now it's so easy to create new little software tools to be able to control these variables and test things and dial it in perfectly, which I guess is where the name Dial Kit comes from.

So yeah, maybe tell us more about Dialkit here. So this is a product that makes it really easy to create and then tweak a lot of these variables in whatever project you're working on, right? Exactly. So yeah, that's basically exactly how it works. You can just run NPM run via his website. He has a little prompt for it. You can just plug it into whatever you're working on.

I have another project that I can quickly show. This is just another version of Dialkit in this specific project. in this specific project where I was manipulating a

carousel. This is inspired by Mike Mattis. He's a design lead at Love From and his portfolio carousel works in this way. And I wanted to see there's so much nuance in the way that carousel works and the way you can drag down an artifact. And when you let go of that artifact, the way basically almost like energy ripples out from that specific artifact and triggers a collision effect with the other artifacts left and right.

Building out the side panel here right now helped me basically look under the hood of my own, of the own Frankenstein that I created here with 91 prompts. And it just helps you dial in some of these some of these different parameters that are really important. Like pull-pull boost means the faster I drag this down, the stronger the boost is.

You want to play around with that toggle a little bit. It can't feel too intimidating or too strong. Otherwise, the whole system just feels off. And I know when it feels off, but the back and forth with chat just doesn't work. You need to be able to always expose those kind of values. It seems like a lot of all the projects that we've looked at here and a lot of what you're describing is just having setting an unreasonably high bar.

And now we have the tools to actually be able to meet it much faster than it would have taken before. Yes. And so what is the role of the designer and maybe even non-designers? How should they be thinking about design? A lot of the audience that watches this are maybe founders of early startups that maybe feel like they're engineers but don't have a design bone in their body.

Yeah. Or designers that are maybe trying to figure out, like, could I start a company or could I actually build the product? I'm so used to, you know, designing a figment, passing it off to somebody maybe where you guys have been in the past. How should they think about themselves and being able to up-level the way that they use AI to create higher quality design? A lot of the way I keep thinking about AI in general is just, it's an infinitely patient collaborator and teammate.

Codex won't get mad at me if I need 91 approaches at getting the animation correct. If I had done that with my engineer, they would probably flip out. But so my advice to everybody is like, and it sounds kind of silly, but like tinker with the tooling. Like you can go in and just describe what you wanted to do. And when you see a result, Don't give up.

Just explain to it that this is not how you envisioned it. Send it a website where you really like the carousel animation or give it a screenshot from Save It or Cosmos of something that you think looks really beautiful. Show it a color palette that it should start to copy for you and just keep going back and forth and back and forth and kind of shaping your narrative together with with the tool, I think that's really important.

And for designers specifically, my trick or what I always learned was just like, just try to copy. Like even now, I'm trying to imitate this carousel animation that's been around for quite a while, because now I have an infinitely patient teacher and friend that I can build it with. And so now I can look under the hood and that's, you know, I'm doing that in my own time on my own weekend without bugging any of the engineers because it's my experiment and I want to understand and decompile how this thing is put together.

And that teaches me how to be a better manager and how to be a better collaborator and be a better team member. And I think that's how we should be treating these tools. Yeah, that's great advice. YC's next batch is now taking applications. Got a startup in you? Apply at YCombinator.com slash apply. It's never too early, and filling out the app will level up your idea.

Okay, back to the video. Should we review some websites? Yeah, I'd love to. Let's do it. Yeah, let's do it. For sure. First up, we've got nstack. So let's see. OK. So this is nstack, the only AI workspace you'll need. One powerful agent, one intuitive desktop workspace, and every tool you need to handle any task. OK. I mean, I think right off the bat, I would say one thing that's very nice about it is the fact that they're emulating obviously the desktop in general.

So it feels like you're on a desktop and I think you can probably use these and explore these. And yeah, I mean, I think what's nice about this is like, you're basically just in their product already and you're, and you're using their product. I think I'm a little confused about what to use it for though. It's like, it's an AI, the only AI workspace you'll need.

It's one desktop, every tool you need to handle any task. And it's hard when it's so broad to figure out what should I use this for? And maybe literally you can use it for anything, but I feel like sometimes it's helpful. Like what do you want the user to do when they hit this? Yeah. I mean, to your point right now, like from a visual perspective, it's very overloading, right? You have a lot of content in the sidebar.

You have this chat history here that you can kind of scroll through. Then it seems like you have some sort of an interface here, but also kind of the main messaging of Nstack sits right over here. It's hard for me to figure out exactly what to focus on first. My German graphic design professor would always say when we were making posters in school, I was studying typography, and he would always say that this poster doesn't dictate.

It's not dictatish. It means there's nothing in this poster right now that is drawing my attention. I don't know what to do when I look at it, basically. I don't know what to look at first. Yeah, do I click these icons? Do I go in the Slack-like thing? Do I go in the chat interface? Am I texting the chat and talking to the chat here? Yeah.

Why am I called Mark? Yeah, you're Mark, I guess. I'm Mark now. I think feedback here, which would be nice, which probably would be like, some of the clutter here, I would almost collapse and make it more around the introduction and the headline and what do I want the user to read and take away. And maybe a simple way into a very quick demo of the tool or of the software offering would be really important.

But at least it's very whimsical and feels kind of retro, which is nice. Yeah. There's always... usually, or there should be one specific goal that is like the primary goal or the primary KPI or the main thing you want a user to do when they hit the site. I'm not sure what it is here. Maybe it's like get started. Maybe it's talk to this agent, but whatever it is, there's so many other things that are pulling your attention and distracting you from whatever it is the main goal is that they want the user to do.

And maybe the get started button is the primary CTA, but they have these other buttons over here. Yeah. that were more in the middle that looked exactly like those buttons. And so now there's multiple buttons that have the same color and are calling, yeah, it's like general engineering, marketing, get started. What is the one that they want us to focus on first? Someone once said this to me.

It's like, oftentimes when we build websites, we focus on one thing on that website and we make that really well. And we built the whole narrative around that one thing. On Collins, it definitely felt more like the book stack was something that we were proud of and wanted to show off. And that is the heart of the website, is a lot of the visual work.

And I thought it was an easy way to navigate into that page. And then you can spend a lot of time there because it's easy to use. As Nstack, I would be asking myself, what is the one thing I can rally around and get people to look at and do? And if they only take one thing away, it's better than trying to do everything at the same time. And that's kind of what's happening here to Nexting.

There's a lot of things screaming for attention. It's the opposite of progressively disclosing information. Yes. And maybe as a positive, one thing that I think is probably good that they do is they're trying to drop you right in the product. I assume this is actually how the product functions and they're not trying to tell you about the product and then get you to click a bunch of things and sign up and stuff.

They're like, if the aha moment is people just starting to use the product, let's just get people into the product as early as possible. But it still feels maybe like we need a little bit more context to figure out what exactly we should be doing here. Agreed. NSEC. Thank you. All right. Let's take a look at SkillSync. Free local first Mac app that carries your memory and skills across every agent and teammate.

That's nice. Yeah. I mean, at least it's clear, I think what, what the company does. That's cool. Okay. Yeah. So it's got skills and they sync.

Yeah. I mean, it's in dark mode. Um, the fonts are, I would say are very small. The difference between skill net as basically the logo and the first paragraph below it, there's a lot of percentages in the, in the typography height here that I, that I, that I think we could, we could skew in a little bit. They, they feel a little off in my opinion.

And again, there's a lot of very dense information. And oftentimes to what we were just saying about Nstack, it's actually as soon as you start to abstract some of the functionalities and features, but still stay very detailed like they're doing here, it becomes very hard to understand exactly what it does. It'll require a lot of actual reading of all of these features to kind of understand what's going on.

I'm curious your take on this. So what they've got here is they've got basically a bunch of sidebar tabs that are trying to show off different features. And you, I feel like, have an interesting approach on tabs because all those sliders that you make, they're effectively like tabs, right? Yeah. It's just you have the affordance of knowing that there are multiple of them and you can see multiple at a time.

Yeah. And I feel like the trap that a lot of people fall into a lot of times with tabs like these is users usually will not click on all of the tabs and explore them all. And so you have to assume that whatever is hidden behind all of them, nobody will ever see. How do you think about that? How can they encourage people to explore this more and get more information rather than burying everything behind tabs? There's this rule I always have.

You can't put more than seven lines of text on a slide if you're presenting work. You have to come up with almost rules and constraints of how many features you want to show off. A good example, I think I would use a three-up component here. I would take all of these features. I would compress this information down and try to understand what are the top three things that Skill Sync can do for you.

You can do X, Y, and Z. Those are the three things you show off. all of those are tappable. They lead you into potentially sheets or a view transition into more information. And then you have more context behind. Since it's very flat and broad, you're kind of like a mile wide, but like only an inch deep. You don't really know what you're really looking at.

That's what that requires, like a deeper understanding of your feature set and then more condensing those down into principles and rules and main kind of like points. And then you can rally or bring more information under each of those kind of pillars. And that'll help the users understand the flow of the website better and how to navigate it.

And it's also better for the founders. I feel like if I was still running my studio and we were working with this company right now, there would be a whole exercise and like, well, what's the one thing you do? If it's syncing skills, let's only talk about that and make that really cool and show that off and then get people to use the product as quickly as possible.

I mean, it's also interesting, like we just hit the bottom of the page. Yeah. It's not very tall. And so I think users are comfortable scrolling. And so if there is important information that is hidden behind a lot of these feature tabs here, just break them out and make the page longer. It's okay. People can scroll longer rather than compressing it and hiding everything.

Exactly. And the other trap that I see a lot of people falling into with the AI tools now is because it's so easy to create a different like image or animation, like these are actually animations, right? For every single one of these, They spit out a bunch of these and they've all got the hallmarks of the very small text and this animation.

No human would spend the time and go like, oh, we need a little dot that goes from these corners and program that and everything. But it doesn't mean it's actually adding value to what they're doing. And so this, I think, is when you're talking about you need to curate and set the bar and make sure it's communicating the right things. Yeah.

There's lots of things here, but they don't actually help my understanding of the point that it's trying to make. I fully agree. And I feel like that's, again, something where you need to work and hire the right people with the right skill sets to help you do the job. Like, AI definitely can help you probably put this whole website together.

But when it comes to abstracting these features into illustrations... might not be the worst idea to work with an illustration designer who's done this before and who's specialized in information graphics. And maybe that actually becomes, because it's well explained, just a core part of the SkillSync brand identity. It's like, oh, this is one thing that...

I remember working with Gemini a few years ago and there was this animation, like a braid, like basically they were showing the model and all of these different things that Gemini had and they all came together and built like this helix. And that animation was, it basically just explained exactly the capabilities of the model And that turned into a very thin line and then it said Gemini.

And that was an animation that a lot of people worked on who are much more talented than me for a very long time. And then later a lot of really good engineers translated that into a scrollable animation for the website. And it just like that kind of sold it. And then you were in the product and you were using it, but that was the memory of like that piece of motion was just ingrained in my memory and really explained exactly what the model was doing.

Sometimes being a little more artistic and abstract actually goes a really long way. And I think, yeah, for Skill Sync, I could definitely see, there's a million different patterns and a million visual examples of how to show that off. And you can be a lot more like just craftful and graphical about how you design that on the website. So that would be my feedback to these guys.

Cool. Thank you, Skill Sync. Thank you very much. Okay. Next up, we got Instaplay. So let's see. So I'm seeing a bunch of featured. I can't tell if these are movies or games. So it says design something that. Bird sort. Bird sort. Okay. So these are games that we can play. I think.

Okay. How do we play? Got a bunch of birds. We got some sound that's playing now.

Let's maybe go. Let's go for, let's try something else. Start button.

We're fighting this wolf I guess. That's enough. So we've got this call out here, which it's interesting. You know, it says, describe your game idea, right? When you click into it. What's interesting is there was no copy under the title InstaPlay. And so we were up to ourselves to try to figure out how to orient around this page. And the first thing that we did is we saw all the visual games, all the screenshots of them.

And so we jumped right to that. Yeah. Yes. And so we miss the fact that actually the primary purpose here is for us to be able to just create our own games on the fly. Yes. And so I think a line of text could help with that or some type of call out that makes the prompt box more prominent. And again, it goes back to your example from earlier.

It's like, what is the one thing we want the user to take away when they land on the page? Is it exploring the multitudes of games that have already been created on this platform? Or is it the fact that we can create our own games? Creating our own games actually leads you to a signup page, which no one's going to do if they haven't seen their created game.

So you have to come up, you have to cough up enough credits to try to like onboard people into the product. That's the cost of acquisition of one user, by the way, and that metrics is extremely important. It's probably obviously what they're thinking about, but that cost of acquisition can't continue with Google. It has to be whatever I just asked it to do, it has to spit it out perfectly, and I have to be able to try it one or two more times.

And if that works, I might be inclined to actually use that piece of software. So you put in a prompt, you submit it, and it takes you to this screen asking you to sign in. And the problem is, we don't know if this is good. This is a great example, obviously, where I would also... You could build out a really cool interactive carousel here, and each game has almost like 10 seconds of a reel playing, rather than just seeing these static assets right now.

I don't know what's behind it, so I don't know what I'm looking at. This is a great example. You could probably get Codex to tap into each one of these, screen record it, and replace that as the thumbnail, at least maybe on hover states, and it kind of will bring maybe more interactivity and dynamism into all of this, into all of these different universes.

I think what they're trying to show with... these covers, it's just like, look, with InstaPlay, you can do a lot of stuff. I don't even think we need to be able to play all of these different games if the call to action is to create our own game and be game designers ourselves. Right. And so if that is the primary call to action, that is not what we did first.

And then you probably want to actually create the game for people so that they can play with it. And then if they want to save it or come back to it later or share it with anybody, then you got to sign up or then you got to create your account. And here also, look, so you have create my games for you explorer. No one knows what any of that means, by the way.

But if you click on any of them, like my game, for instance, again, it leads you to a sign up. Like, if you're not signed up to this page, you shouldn't even see my games probably, right? And have the ability to tap into something that then will lead you to sign in again. For you leads me back to the game I was just on, which I don't know if that makes a lot of sense.

And Explorer is basically the page we're already on. You're already exploring on home. I don't even think that needs to be a new button. The only thing you've done now on the Explorer page is taking the input field away from you. So now I can't create a game anymore. So there's a few things there in the hierarchy where I would really think very, like, put yourself in the position of someone coming to your website for the first time who has no idea what it is that you're building or selling.

Yeah. How do they interact with the product? It was also interesting because you went into the game and we were like, okay, we're done with this one. I want to get back. It wasn't obvious to me that you do the fast forward icon to get back to the homepage. I thought it was going to take me to another game. It can be misconstrued as an arrow really quickly.

Right. And so it's interesting. You actually click the back button to get back because there was no obvious home to go back to. Exactly. But this is super cool. You can imagine just getting people to put in a prompt and creating a game just like the racing game you were just doing. People could play with this for hours. And you just got to get people to that value of creating the game and experiencing something.

Once you've created that game and you're proud of what you created, being able to share that with your friends is probably a really nice growth hack for these guys. And I think there's a lot of value in this kind of work. So props to them. Yeah. Nice job, InstaPlay. Okay. Next up, we have Mintlify, the knowledge infrastructure agents build on.

Self-updating documentation for startups, enterprises, and agents. Right. Cool. I'm obviously very familiar with Mintlify. It's an incredible company. It's been growing really quickly and is a product that tons of YC companies and other dev tools use. Yeah. Yeah, this... It's a beautiful website. Yeah, this looks very professional. It looks like something that is trustworthy.

It's straightforward. It's very clean. The very nice compositions with color and typography and spacing and line heights. Yeah, so let's drill down to like, why do we feel that way? What are the specific elements of this page that make us feel like this is very clean and professional and all those things that we said? I think because it's being reductive in exactly the correct ways and it's showing only the things that are actually necessary to show.

It's got a very clean headline, a small paragraph underneath the get started button is very prominent. It's showing off some kind of a dashboard. You can kind of understand, okay, this is probably where the documentation would live and where the documentation would get updated. The graphic in the background is actually adding to the vibe rather than taking away from it.

It's subtle and in the background it feels...

It feels like it's helping you think it's some kind of a network or something. It feels like they're very cautious and careful with what they're building and some kind of an infrastructure intelligence layer.

I never know about logo walls, but at least this logo wall is very well put together. It's a lot of really big, credible companies, which builds a lot of social proof, which seems to be something like, you know, we have this vibe of like professional trustworthy. And part of that is communicated via seeing Microsoft and Anthropic and X and Coinbase are their users as well.

With so many tools flooding the market, you need that kind of proof point to be like, okay, well, if Spotify is using it, maybe we should actually look at it. And then I think this is just a great example of, like, they're abstracting UI and feature capabilities into something very cohesive and something really nice and art directed that feels, you know, interesting to look at.

I would say maybe the headlines here for these cards are a little bit too small. If I look at all of them right now, with the background color being the same, I'm kind of looking at none of them. And... they're reusing that kind of braided animation in the background, and that's kind of losing its magic if you keep kind of reusing it all over the place.

So I would actually say less is more here, and the headlines could be a little bit larger. Yeah, again here, it's kind of like... I'm not sure if you need that. It's very hard to read, build on top of your existing setup. Yeah, and that actually seems like a very important point that you would want people to know. You can control who has access.

You can build on top of your existing setup. Exactly. But it's super easy to miss it because the screenshot takes up a lot more of the space. There's this animation that is drawing your attention away from this headline that is actually really important and buried at the bottom. Exactly, exactly. And then you have to differentiate between how much information is the visual that you added actually giving the user versus the copy that you could add to it.

And that balance I think is a little off here, but overall very beautiful. These are just nice. This is a really simple to use carousel. I can swipe through it. The colors are mapped to the photography.

I think that's something that people don't get credit for enough. Like, this is great and really well done. It's Manhattan. It's the blue sky. It's Coinbase. It's a blue artifact here. Like, that feels really nice to kind of scroll through and see. They're very branded. Yeah. Although these colors are too close together, so they kind of...

I would have used a different color for this one here. Yeah. But overall, it's really nice. Maybe like a gray or... I'd probably, this is maybe more the AT&T blue, but this image I would maybe use a different image. That's probably correct. Yeah. Um, yeah, but overall, I mean, very clean, very, very trustworthy. There's a lot of space between the sections too, which is, I know that is a technique that you use a lot on, on your designs and things that you build.

I mean, each section of the homepage is basically the first chapter of all the child pages. So a lot of the times what we would do when we were designing for clients is like, if you are talking about products, solutions, resources, and pricing, then those are the four main parts of your homepage because apparently that's what we're deeming the most important parts.

The product features, our solutions, the resources and the pricing. As you scroll through the website, those four components show up in exactly that order from most important to least important because of scroll depth, like people drop off as they scroll through the page. So important content has to sit obviously at the top. And then each one of these sections should lead me in to that.

So if I click on... So theoretically, I would have had a whole section for product right here on the homepage. And then from there, you could click into products Products, by the way, actually should probably have a homepage itself because there are so many products. But yeah, overall, it's well-designed and it's simple. It looks like they took time and care to make this website, which is nice to see.

Yeah, it's interesting. It's a lot more breathable. It feels like there's less going on here versus some of the other ones that we look at. There's still a lot of content, but it's spaced out and distributed across. Everything has its own space, which helps the user know what to focus on at any one time, rather than feeling like there's lots of things that are trying to draw their attention.

And it's interesting how you describe that as like, this actually took more time. Yeah. than the things that have lots of time or lots of competing elements because it actually takes work and curation to figure out what are the things that we actually want to keep. It's easy to throw everything. It's much harder to figure out what needs to be edited out.

Because that conversation is just much harder to have with the team. Everyone's competing. Everyone wants their functionalities or their features to be on the page. And you have to curate and make a decision and reduce, which is the job of any designer. Reduce complexity and show one piece at a time and drive narrative that way. It's hard to do, but it pays off when done correctly.

Yeah, this is excellent. Great work, Mentlify. Okay, next up we have Nullify. So your users don't read your docs, your patients don't read your manuals, your employees don't read your content. Nullify turns your docs and ideas into narrated, animated videos. Make them yourself in minutes or have our studio team make them for you for teams who need more video than they have time to make.

Okay. I think right off the bat, being a typography designer, I would say there's a headline, there's a paragraph, and there's almost like a smaller version of the paragraph underneath in a different font size. And then there's the book a demo button and the start free button. There's one, two, three, four, potentially five font sizes right in the viewport here, disregarding all of the logos and the banner here in the corner.

It's just a lot going on from that perspective. You can have a headline and then you have the paragraph and... You have to put all of the important information into that paragraph. You can't keep adding headlines to it and making the user read all of those different points. The first thing that jumped out at me is the two placeholder elements in the headline.

And I find that to be disorienting. It's one thing if you have one and it's changing because then you can anchor yourself on we do this for this type of person and this type of person, this type of person. But with two elements changing, it's like the user is changing and the like docs or manuals or whatever. And then it sounds like it's actually like a video thing.

Yeah. Which I would not have gotten from the headline at all. And so I think what they're trying to say is like, hey, people don't read these documents and PDFs and stuff like that. So you need videos so that they pay attention to stuff. But I feel like they need to say they do videos that convert better, kind of like the positive of what they do.

Could they use their own studio to make a video and put that on the website and we watch that first? Yeah. It proved their point, right? People don't read all of this. We're not going to read any of this anyway. So just show us a video of what you do. There's a carousel here that I think just basically shows off the product. So let's, right.

I assume these are examples of, you can't, you can't click into one of them. You have to use the, the, the icon. That's not good. And this card needs to be tabable. Obviously you look at this and you want to, you want to click into it.

Every year, thousands of warehouse workers get injured. Okay. So it's like an instructional animation video. Most of those incidents are completely preventable. and warning devices. The video looks well made. The thing that we want to do here, though, which is interesting tying back to a lot of the carousels that you've created in those past projects that you showed, is I'm exploring a lot of their work.

And when I click into the one, it comes full screen. And then I figure out like, okay, how do I minimize X this out? And what I really want to do is I want to have it zoom in so I can see it play. And then I want to be able to keep jumping to the other ones because I want to see the depth and variety of what they can create. And it's kind of hard to do that right now.

Yeah. None of these are tappable. I can't open them up full screen. It's like, you have to like use all of the, you have to use all of the, um, the little buttons here. You can't skip through them. I would want it to zoom up, not the full width and take over everything. Yeah. but like 90% or something. Just enough to show me what's going on.

And then I can start swiping for all of them. And maybe right underneath, show me that actual company. And maybe these are all actually case studies. So as they open up, you could open these up in really nice sheets with a depth. So the rest of the page... pushes back, sheet comes up, you can see the video at the top, maybe there's a description of what that video is for, what's the construction company, a bit of a case study.

That could also almost lead you into like customer stories or success stories. These are obviously the demos they're showing off of past clients that have worked with them. So there should be more focus on those videos, less, I think, on the logo banner ad here, a conciser headline that doesn't jump around between two things happening at the same time.

And, yeah. And now we get into the platform. Well, exactly. Now we're getting into the product. Now they're describing it like, oh, yeah. Oh, the platform. Here, go up just a little bit here. Oh, sorry. Another video.

So you make the video, upload a doc, a blog post, or an idea and get a narrated animated video in minutes. Edit it just by chatting. I feel like that's what I need all the way up here at the top. To explain what it is that they're doing. Yeah. Because right off the bat, I don't even know if this is for me. And so how many people do they lose that would be ideal customers, but can't even figure out that this is for them.

Show me what the product does. And if I'm into that, then show me the results. Yep. I also know it's, it's scroll jacking here. Yeah. Which drives me crazy. I agree. Um, cause it feels less responsive to the scroll that I'm trying to do it. It takes a while to ramp up to the speed. I think I want to, I want to take the time here on this podcast to talk about scroll jacking in general and scroll manipulation on websites.

Yeah. Smooth scrolling on websites is a disaster in the industry. And I feel like you use the native scroll on websites and don't hinder the speed at which a user wants to interact with the content of your website. That is exactly what we were talking about earlier with interruptible interfaces. Apple has pioneered this for decades and their software and their hardware is proof of that.

You want interruptible software because our thought patterns are interruptible. You might think something and click on something else. And you would never want to get a user into an environment where they have to smooth scroll or scroll jack through the content because that's the way you think they are going to perceive or digest this content.

That's almost an arrogant way of going about it. I always feel like I want to be as unobstructive as possible and be as polite as I enter the room. Dieter Rams would always say, enter politely and quietly when you walk into the room. I love that. Well, also as users, this is not the only website we've ever used. Exactly. We're used to scrolling on probably hundreds of thousands, maybe millions of other websites.

Usually on our phones. Yeah, and on phones. And we get used to the sensitivity and the precision with which we scroll. And when something changes that, you have to reorient yourself to try to find what you're looking for and it becomes a distraction. And it just becomes sluggish. Like I'm trying to... pause on this piece of content, but the animation's kind of still playing, so now I'm trying to use the trackpad to counter that animation, and it's making me uncomfortable.

I don't want to have to scroll like that. And then since the tap targets here are really difficult, you have to hit these tiny buttons,

it's a bit complicated. At the end of the day, they just have multiple different carousels on this website, all with video players behind it that open up in a full-screen video player, but the only way to exit out is with the escape button. Overall, the videos seem very, very well done. The videos seem great. Yeah, just getting people into those and being able to see more of them and experience them and understand the case studies behind them seems to be the thing that will convert people.

Yeah, and I think if this is improving the health and safety of Adidas or that construction company, then Nullify is doing a great job. And that's the product they're selling. Awesome. Thank you, Nullify. Okay, next up we have Instinct. building the lunar future today. Okay. So we got a moon building the lunar future and we've got some kind of satellite that's floating around.

Yeah. It's nice. It's very immersive. I think it's very safe to say that these guys are working on space technology. What gave you that idea? Aerospace technology, so already there, kudos. I think to go back into AI world for a second, this is a great example of, I think you can very easily get an LLM to make you kind of like a 3D version or a WebGL version of a moon that you can put on this website that kind of is interactable with the cursor.

That's something that I would probably add to this page. Both of these elements are actually things that I would render in 3D and then have as live objects on the page. That's not totally impossible to do now with AI. So there's something around that that I would add to this to build a, we call them showstopper components. So when you have one or two components on the website that really take all of your attention and really draw you into what's going on, I feel like that's an awesome moment to show something like that off.

Yeah. I think this is very well done because right off the bat, we knew exactly what this was. Yeah. And the animation here of like showing it in 3D, it could have just been a 2D. It could have been a photo. Yes. You know, that they superimposed. But there's something about that that draws our attention to like, oh, this is actually the thing that they're building.

The moon is a photo here in the background, so that's the thing that I was reacting to. But yeah, you're totally right. Also, nice use of the font. I feel like a lot of the websites right now are working in a very safe, considered space with a sans serif, and having the courage to try to wield a serif font on the website is a nice touch. I will say on that note, the logo itself, the font here, and this typography here are all different and kind of competing.

And then there's a lot of color in the logos down here. including your lovely logo. And I feel like it's almost drawing too much attention away from the actual message. And in this case, there's only one message. It's nice and reductive, but you have space to add one more piece of meta content here that maybe talks more about what your company does and what you're building.

But let's dive further in. Yeah, so now they get more specific. Instinct is building the lunar lander for today's space industry. So launch, cruise, land. Yeah, I think it kind of explains what's going on. That's really cool that when you hover over it, you see it. I mean, the first one, I couldn't really tell what's happening there. This doesn't really look like a launch to me.

Oh, there we go. Okay, you just had to sit with it for a while. So maybe they can get to that faster. Way faster. Attention spam in general is decreasing. Half a second. Like that's what was cool about the second one is as soon as you hover, it takes off. Exactly. I think that's a very good piece of feedback here. Like the moment you hover over this, this thing should open up.

There's a world where you could have them all play at the same time because they're very concise moments. It's just the launch. It's just cruise. It's just land. And they can actually all play in quick looping videos. And you could probably get the point across even faster. And the land video, it doesn't really get the point across. I don't think everybody immediately understands that's the moon and then you're slowly coming closer to it.

I think that like what you're actually waiting for is this moment, right? You want to see. Yeah, there you go. You see the shadow getting bigger. That's it. That's what I want to see. I wouldn't even show any of the other stuff. Yeah, it should have just been that. It should have just been this. It should be that, this scene, and then this, but with the top open.

And that's all you need to do here. And again, one, two, three, three, three. Like the three up is nice as well. On mobile, this really quickly turns into a nice carousel. So very easy to translate this into mobile.

Again, primal strategy that JTAL and me, our school of thought on this would always be, you have technology, company, news, careers, merch. If these are the things that you deem as important for your business, those are the chapters on the homepage. Show off technology, show off the company, show off news and careers. Don't make me use the navigation at the top.

These are all elements that you can bring into the homepage, and from there, using very simple sheets, you can just transition into any piece of that content, and it'll make this whole thing feel way more digestible and readable. But let's click through some of the pages. Yeah, that's cool. Okay, so what I like about this, it looks like it's real video, and so it makes me feel like this is real.

I mean, this is real. Yeah. It's not like a bunch of renderings and, you know, it's hard to tell. Is this real? Is this just like a plan that they have? And it's like, no, they're actually doing the thing. They're building this. Yeah. I think again, great example. There's on, there's not that much information on the technology section. This whole video could have been a piece of content on the homepage that says explore our technology.

You tap into it, you open up a new component like this, you scroll through it. And when you, when you scroll back out, you're, you're on the homepage again, like that interaction pattern would work really nicely. And this is super cool. Um, and you're relying on people to click on the technology page in order to see any of that. Exactly. We're getting a little sloppy here with the cover images here.

I think there's a lot of stuff going on. It doesn't match the quality and the style of the rest of the pages. No, not at all. And I think very important for Instinct to remember here, you can use the serif for the headline. That becomes a stylistic element of the overall art direction for your branding. You don't use it for any of the body copy or paragraph copy.

Those are sans serif. That's a sans serif font. So these, this, this information here and this information here, I would use something like instrument or just like a normal sans serif, like a, like an inter or something that works really well here. We were looking at carousels earlier, like this carousel doesn't drag, this carousel doesn't swipe with the track pad.

This whole carousel only works if I interact with these buttons. That's definitely not the way I would, you, you build these components. I think my takeaway is you got to release carousel kit. We have a carousel kit actually that Jasper Voss has been working on called Blossom Carousel. And Blossom Carousel is basically,

this carousel swipes and scrolls and it comes in a multitude of different variations and versions. It comes as stacks on mobile. This is free to use and on GitHub. So any founders or any entrepreneurs who are watching the show, you can. Yeah, this is great. Everybody should use this. Instantly, your carousels will get way better. Exactly.

Awesome. Awesome instinct. Thank you. Great work instinct. Awesome. That does it for this design review. Marvin, thank you so much for being on. Thank you so much for having me. It's so lovely to be here. It's nice to be in San Francisco. It's just like, yeah, the energy here is unmatched. White Combinator is awesome. The office here is sick.

I like, I'm so glad that you guys asked me to be on the show and it's just, it's nice to get to sit with like-minded people who just want to look a little bit under the hood. We went through some of that work and I think Yeah, thank you for letting me show a little bit of my workflow. And it's awesome to see all these companies coming up with so much innovative new work.

Yeah, well, it was amazing to see the behind the scenes of your work and really get into your mind and how you think about how you set the bar and level it up with not just the visuals, but a lot of the interaction and how users actually experience the work that you do. So yeah, thank you so much for sharing it with us. And that does it for this episode of Design Review.

We'll see you on the next one. Bye, guys.

Related episodes

0:00 Tap any line to play from there.

Weekly highlights

One letter a week.

The notes worth hearing, with the minute they were said.