Will ChatGPT Vision Replace Frontend Developers?
Вставка
- Опубліковано 16 лип 2024
- bit.ly/3PWdbkz 👈 Design & code like me. Use "UI2023" for 23% Off!
designcourse.com/af 👈 My upcoming "Advanced Frontends" Course
-- Today, I'm going to test out the brand new ChatGPT Vision to see just how well it can take 3 different UI design mockups, and translate them to the browser with HTML, CSS, and even JavaScript.
0:00 - Intro
0:33 - Layout 1 (Simple Card)
2:26 - Layout 1 Results
3:10 - Layout 2 (Responsive List)
4:52 - Layout 2 Results
6:31 - Layout 2 Follow-up Results
7:16 - Layout 3 (Full layout)
9:34 - Layout 3 Results
10:28 - Final Thoughts
Let's get started!
#ai #chatgpt #frontend
- - - - - - - - - - - - - - - - - - - - - -
Subscribe for NEW VIDEOS!
Learn UI/UX: designcourse.com
My personal FB account: logodesigner
Coursetro FB: coursetro
Coursetro's Twitter: / designcoursecom
Join my Discord! / discord
^-Chat with me and others
- - - - - - - - - - - - - - - - - - - - - -
Who is Gary Simon? Well, I'm a full stack developer with 2+ decades experience and I teach people how to design and code. I've created around 100+ courses for big brands like LinkedIn, Lynda.com, Pluralsight and Envato Network.
Now, I focus all of my time and energy on this channel and my website Designcourse.com.
Come to my discord server or add me on social media and say Hi! - Навчання та стиль
I personally can't wait until AI can take care of frontend. The goal is to speed up development so that we can focus on the product and customers.
Nope, just enhances our jobs. We still have to double check it’s work 🫵
Can't wait for it to take over ui/ux. Itseems it's abilities are more tuned for creativity.
I like to code, so I need to go to the backend
Ah yes, remind me again how do you focus on the product as a software engineer (server/client or both) when 95% of the job will be automated in 5 years time ? Even UI will be a press of a button in 5 years if this keeps going.
What we'll all be CEOs or suddenly become math geniuses and will LOVE working with statistics and go be AI engineers or all the people that like working on the visual part of a digital product suddenly switch to become DevOps or Cloud engineers ?
And don't get me started on prompt engineering because that's a joke because when it gets to the point that anybody can type in a paragraph and get half an app in 15 min then talk to chatgpt again and midjourney/dall-e for another 30 min and boom you get the product, then that suddenly is not a job anymore.
Oh and I LOVE how some companies have clips with people saying AI but with "Man in the middle". Guess what part of the production/supply chain almost every company for the past 15 years has been replacing ? Hint: Cutting out the middle man.
And whoever thinks that companies won't replace you before you can blink you're very very wrong. An employee is an expense and a liability on the balance sheet and as long as the Growth mentality and the priority to appease stockholders first and foremost at the expense of the working class, that's how it'll stay until people speak up and Demand a change out of this disgusting monetary system. Wonder how long of people will be out of a job and in poverty, spending what little money they'll have to buy courses to "upskill" or "reskill" (good luck doing that with hundreds of millions of people)
Really don't see how people don't understand this. This is what AI can do NOW less than 1 year after the major version got released, that put it on every media's radar for 2 months but they've suddenly stopped talking about it. You really think it won't be able to do 95% of anything that's done with a computer in 5 years time ?
And if people don't speak up and continue with this system, guess who'll be reskilled into blue collar workers? Hint it won't be the politicians or the Executives of companies.
well i'm sure it will replace ui/ux designers much faster so we can focus on the product and customers.
I'm a frontend dev myself and I use chatgpt sometimes. If it's gonna replace anybody it won't replace the developer, it'll replace Stack Overflow. It's actually already happening
I am in the middle of my journey to become a fronted dev, and I use it a lot to debug sytax errors and other minor stuff - and to explain things to me and add comments to my code. I think in those areas, it is great!
I was working with an older Python library recently, and GPT had no chance of providing anything usable. When it gets out of the scope of basic monkey see monkey do code, it's totally lost. Github copilot was also not helpful at all. Stack Overflow helped me with the first link available I saw. Not that I'm not using GPT, I'm using it a lot, but it's not near good enough
simple questions yes, but complex ones no
exactly 😂. im more about the backend but i can design decently so i would say ofc it won’t replace a frontend dev
When prompting especially something as complex as the last example. A good prompt would be to ask gpt “To explain in detail what does it see in the image”, once it gives you an answer, correct gpt on where it made mistakes and then ask it to write the code.
Have u tried this yourself? Was it able to create something like that complex last design?
That's some solid advice!
Even ChatGPT can't do CSS. I feel better about myself now
Yes it can, especially GPT4. It depends on how well you can prompt it, if you prompt it right it's gonna do a better job. Proof: I'm about to launch an esports website with css and UI elements done entirely by it, as a matter of fact it coded both the front-end and back-end from scratch, saving me close to $100k in dev costs.
@@tedstersscience1637😂😂😂 of all the things that never happened, this never "happenedest".
That's now. What will happen in 1y or 2y.
everyone hates CSS, even ChatGPT lmao
Yet*
I tried asking it "Replicate it exactly as in the photo in code" and it came out pretty well
We don’t need to be scared. When chatgpt give us a wrong answer, we need to be frontend to fix it 🤷🏻♂️
It's impressive that it gets the overall structure pretty well and created working javascript for the timer as well. As a front end dev, i don't think AI is quite there yet, but it's getting closer and closer.
The answer is not today
Yeah, I was dealing with a similar issues with chatGPT. It can help but it definitely has trouble making a final product or doing abstract things. I just wasted an hour and a half trying to get the AI to help me out with displaying a 3D object in a web page. A .glb 3D object.
By reading the comments, my I suggest like a tiny series on prompts. Looking at how different prompts would solve different designs.
As someone who definitely doesn't ask ChatGPT weird stuff, you might want to clear or hide your chats before recording (click your face > Settings).
I am anxious every time you post a ChatGPT vid.😬
ChatGPT is like working with someone who understands what you want, if you gonna tell it using basic explanation, you except basic results, you can't expect super results with basic prompting, everything depends on your prompting
I couldn't agree more. And if you know how to prompt it, one man can beat entire dev teams.
The prompts will have to be chained. First focusing on the overall structure, and then on the specific modifiable parts of it.
what is live server you just used? is it something built in in VSCode ?
Gosh, what a relief. I'm learning JavaScript right now, intensively, and for a second, after reading the title, I thought "ugh, damn"
Good work.
As a frontend dev, a part of me was happy that it didn't knock it out of the park on the first try. But I am excited to see what it can do in the future.
I am in the camp that believes AI is a tool that will make our jobs easier and get products across the finish line faster if used correctly and not as a full replacement of everyone involved from start to finish.
One thing that I have noticed when using chat GPT is it. Sometimes you have to kind of be rude to it. It'll forget stuff and sometimes it won't write the code the right way because it will forget a block. So sometimes you have to say "Hey you forgot stuff. Can you go back and check and see if you miss something" And usually if I do that it will say oh sorry and give me the correct result.
That is awesome. You have to hold it accountable just like a subordinate 😂
It's great for javascript and anything that relies on calculations, but with design led things, I think it's harder work to speak to it correctly than actually code it yourself. It still works as a great developer helper whilst I do the senior work ha
As a junior I've found it to be a good resource as an assistant to solve problems and freshening up on syntax I haven't used much or not in a while. It's a useful tool, but far from a replacement.
It's ur way of prompting, i've got 90% close to ur UI with just one line.
My experience with ChatGPT when asking it engineering questions is that it will routinely "lie" to you. I think that they call this hallucinations in the machine learning parlance. Some often repeated advice that I see online is to give it more sophisticated prompts and then it will start doing better but this doesn't seem to align with my experience at all. But perhaps I'm misapplying the advice. From what I've seen the more focused you can make it on one particular aspect of the problem the better the result. So in the case of your examples here the way I would have done it would have been to have it focus on layout only and ignore styling entirely.
Absolutely, the advancement of AI in frontend development holds great potential for speeding up the process. It allows us to shift our focus towards enhancing the product and addressing customer needs more efficiently. Exciting times ahead!
You'll get much better results if you edit your prompt and resubmit than if you try to steer it. I usually add things like, I tried this before but it did xyz.
So I believe it will help speed up the work, just not do it completely. The js it did worked, so maybe if you just provided that section and prompted the design more specific it would work, I don't know, just thinking that's it's like a student learning, can't ask too much of a complex request.
You still need frontend engineers for the logic, backend api calls and everything.
Atleast we can create markup 😊
But stack overflow still cost less and more environmental friendly?
And even if your prompt engineering sucks (I wouldn't know because I don't have the best prompt skills either 🤣) it seems like it starts to almost be just as much work prompting to just code the thing! With tailwindcss we can have this design up in running before any one is done prompting and re-prompting chaptGPT. Not quite there but I am sure it will get better with time!
Can it design with SwiftUI ??? For iOS App?
One other thing to think about is that in Chad GPT4. You can also have it generate images as well so you can tell it to generate the oceans image and it'll give you a code prompt snippet that you can paste and it'll generate that image for you. If you just don't happen to have one. That's a neat tip
Pretty sick of these scaremongering 'Will AI replace you' videos from tech youtubers. It's pretty insulting to your viewers.
I mean... It's a legitimate question, and good to keep track of how far along it is. Need to stay ahead of the AI if you wanna stay relevant.
And it makes for an interesting video!
@@garrettsmith6014 I reject the whole idea that AI tools are inevitable. It's fearmonging for views.
But real companies don't write frontend code like this lol
Things are wrapped in react, nextjs, tailwind etc, and they often have their in house libraries as well
Not to mention the amount of time you spend on writing details prompts is getting longer and longer plus the time you have to spend on modifying the generated code, you might as well write it yourself 😉
What you're failing to see is that while writing prompts with sufficient specificity can be tedious, it reduces the entry barrier a whole lot, and one man can replace entire dev teams, reducing costs my up to 70% in certain cases. And I know this because I've done it myself.
@@tedstersscience1637 You've never been in a professional environment lol
@@FrozenPrimordial you're right, I wasn't "in it", I was the professional environment. I used to hire people to the job for me, but not anymore, since I do a better job with GPT4.
Not yet and I think it will take a lot longer before it can. However it will! Design for the web is a solved problem, the patterns are established, it's no longer like the wildwest in the 90s
There is still a lot of room for improvement in the prompt.
But I can't predict how much better the result actually will be though.
I believe that it can be easier for an AI to take a Figma project (with all spaces, typography, colors, visual assets, etc) and translate that to code, and there are plugins already trying to do that. If these plugins succeed in this purpose, IMHO, the UI design process and frontend development process will be so easy that one person can be both easily, and then we all will be UI designers/developers.
Yes true shift that is already well underway - design tools will disappear and AI is smart enough to build ad-hoc interfaces on the fly, the designer's role as an intermediary becomes less important.
Let's revisit this in a year...
Frontend/Web designers? Maybe. Developers and engineers? Will take a while
Answer will be always no. Technology is a means to an end.
Other thought; in 5-10 years programming will be done differently. Excited about it
Might replace teams working on UI components that implement a given design system. Allow for developers to focus on something that gives the product more value.
😂 me becoming front-end engineers with the help of chatgpt
It's definitely a bit hit and miss when it comes to web design and development. I've had better success getting it to iterate over sections of page design as opposed to getting it to do the whole lot at once. But even then, be prepared to put your own skills to use.
Much as is the case when asking it to do run of the mill development tasks. So that's not entirely a win for gpt. But it is for us not losing our jobs any time soon!
It's the first iteration ever of GPT vision and it's already amazing. Imagine where it will be a year from now? 2 years from now?
People are having quite the misconception when they're judging this as the end product when really we're just at the stage of introducing the PC in the mid 80s.
We only have exponential growth from here on out.
@@cagnazzo82 i don't disagree. And I'm certainly not someone who thinks this is a finished product. None of the openai LLM's are. They're all just iterations of and being constantly my improved upon.
The last part is too funny 😂😂😂😂😂 - chatGpt can't replace the developer.
I think somebody did something with chatGPT. In the beginning of the year it was better. It understood better. Lately it´s gone down in quality.
Last design was good and even better than your design IMO. 😜
Your chat history dude
I am using Chat GPT a lot for the frontend and also the backend sometimes. Most of times I need to spend some time in the chat but almost everytime I get what I need. Saving too much time instead looking in post on stack overflow...
But I can see that the AI is not perfect yet. Midjourney for example can't draw hands correctly, darts ...
Chatgpt can't see colors...😂
It's a first step. But whoever say that is not using Chat GPT for some tasks or other, is lying
the secret sauce for the prompt is still actual code
It's really important to get the prompts right (fine tuned) as that can make a huge difference in your end result
Don't use 2 images. One at the time give better result !
It's fun now. But give it two years and it will be excellent
Its quite clear to me from having used Chat GPT and seeing this that the idea of this replacing developers is years away. Chat GPT is great for quick snippets of well referenced code on the web but its actually pretty shite and writing its own and even just writing short bits of code like those examples are pretty bad, imagine an entire project. You may get something resembling a website but your going to have to pay a dev to come and fix all the bugs with it anyway and it will take them just as long because now they have to untangle this AI crap code first
Currently its a good option for anyone trying to push out a prototype for gaining consumer insights and seed funding.
Actual development can't be replaced as of now
haaha, really amazing
We all know Frontend development is not just building UI but also complex solution on the frontend. The softwares or products have become more complex and both frontend and backend need specific skills and solutions. No one can can be sure of the future but looks like generative AI (based on current progress) will replace lots of development workflow we are currently using.
My humble request to stop using click bait title for your video. You videos are high quality and this video is also informative. But we are seeing lots of click bait videos from people knows a little about technology or how it works, and then claims end of everything. They might use reference of reputated creators like you. Thank you for you videos.
Ofcourse AI will replace us developers, but in 100 years. When the time comes, I will be have invested in farming already 👍
😢
Our jobs are secure!!! ...for now.
It already replaced many
Just praying for the day ChatGPT replaces annoying hypetubers
For everyone who cant wait for gpt to replace coders , remember , you are the ones who will be replaced first as designers. 🤗
We are all going to be controlled by the system so noone can do jobs , cant understand people who cant wait for any type of job to be replaced , maybe just surgeons should be replaced with robots because of corrupted medicine industry
chat gpt probably uses less is more design principle 😂
GUYS, remember, dont be a script kiddie, chatgpt is a word ranking algorithm not a developer. Idk how yall really believe this can go corporate
Its almost as if chatGPT hates developers
Can't wait to lose my job xdd
Thank god this is not as good as I thought it would be going into this video. It is really terrifying to be honest
IMO it is easier to just type in the CSS and HTML your self instead of taking the screenshot, writing the prompt and then waiting for the results .... it probably is even easier to skip the figma file and write it all directly in CSS if you're good
Nothing new... (framerAI) do the same thing...
Just design your UI and framer give u the HTML right away...
And also have AI for UI design automatically..
I think AI going to do syntax thing we just need to focus on develop and code management . Oh by the way FIGMA have same pluging called:iconify that thing can transfer UI to the typescript js html tailwind...
Your prompting technique is hard to watch. Lol < mid, you need to first understand Ai if you want to talk to Ai 🤖
U just have to explain it good enough...🤷 The thing works perfect 😂💔
ChatGPT can't repeat simple instructions. If I ask it to repeat what it did before, it will fail. Chatgpt also can't tell fact from fiction. We need human smarts.
That propmt really sucked
I'll have you 11 minutes, no it won't
The whole idea of "putting humans out of a job" is such a preposterous idea. If anything, it will change the nature of the work.
nothing that a human can't create now
Lol no