Apple Vision Pro '공식 웹사이트'를 1분 안에 만드시겠습니까? 직장에서 8시간 만에 480개의 웹페이지를 만들었고 동료들은 열광했습니다.

PHPz
풀어 주다: 2023-06-10 19:17:10
앞으로
625명이 탐색했습니다.

최근 애플의 MR 헤드셋에 전 세계가 열광하고 있습니다. 수많은 복잡한 하드웨어를 하나의 제품에 통합한 Vision Pro는 Apple의 2세기 창작품이라고 할 수 있습니다.

이렇게 폭발적인 효과가 있는데, 내년까지는 소규모로 판매되지 않을 것 같아요. 편집자는 흥분을 참지 못하고 판매 홈페이지를 만들고 싶어해요.

저는 웹사이트 제작 경험이 거의 없고 코드를 작성할 수도 없지만, 최근 대규모 AI 모델의 붐으로 인해 웹사이트를 구축할 수 있는 AI 제품이 분명 있을 것이라는 자신감이 생겼습니다.

편집자는 약간의 검색 끝에 AIGC 제품, 즉 실시간 AI를 발견했습니다. 이를 통해 자연어 설명을 통해 웹 디자인 초안을 생성하고 클릭 한 번으로 온라인 웹 페이지로 게시할 수 있습니다.

더 이상 고민하지 않고 결과는 다음과 같습니다.

1分钟做出苹果Vision Pro「官网」?上班8小时搞出480个网页,同事被卷疯了

디자인은 매우 풍부하지만 프로세스는 실제로 매우 간단합니다.

먼저 Instant AI 공식 홈페이지에 주문을 입력하고 1분 정도 기다리면 다음 4가지 디자인 초안을 얻을 수 있습니다.

1分钟做出苹果Vision Pro「官网」?上班8小时搞出480个网页,同事被卷疯了

디자인 초안 중 하나를 선택하여 한 번의 클릭으로 온라인 웹 페이지.

1分钟做出苹果Vision Pro「官网」?上班8小时搞出480个网页,同事被卷疯了

그러나 생성된 결과에는 자동으로 생성된 이미지가 웹사이트의 콘텐츠 요구 사항에 적합하지 않은 등 몇 가지 문제가 있습니다. 그래서 우리는 오픈소스 웹사이트 unsplash에서 몇 장의 사진을 찾아 디자인 초안에서 편집했습니다.

놀라운 점은 사진 교체, 글꼴 수정 등 디자인 시안에서 수정한 내용이 모두 자동으로 게시된 온라인 웹페이지 "https://js.design/site/ ?id=ai_cY7jfKiL7IY"에 동기화된다는 것입니다. .

주문 입력, 디자인 초안 생성, 웹사이트 게시, 이미지 교체, 재출판까지 모든 과정이 10분도 채 걸리지 않습니다.

우리의 요구에 거의 가까운 웹사이트를 10분만에 만들 수 있다는 것이 이 제품의 매력은 아니지만, 디자인 기초나 코딩 기초가 없는 사람이라도 도메인 이름이 있는 웹사이트를 10분 만에 만들 수 있다는 점입니다. 친절한.

인스턴트 AI: 30초 안에 편집 가능한 UI 디자인 초안을 생성하고 클릭 한 번으로 온라인 웹페이지에 게시하세요.

5월 4일 인스턴트 AI가 완전히 오픈됩니다. 공식 뉴스에 따르면 이 제품은 내부 테스트 기간 동안 100,000건이 넘는 내부 테스트 신청을 받았으며 수백만 건의 결과를 생성했습니다. 이는 제품을 개봉한 후 후속 반복을 위한 좋은 기반을 마련합니다.

5월 31일 인스턴트 AI 제품이 업데이트되어 앱 측 UI 디자인 초안 생성을 기반으로 웹 측 UI 디자인 초안 생성 기능이 중첩되었으며 다음과 같이 원클릭 게시도 지원되었습니다. 온라인 웹페이지.

여기에는 두 가지 기능이 사용됩니다. AI는 UI 디자인 초안을 생성하고 한 번의 클릭으로 디자인 초안을 캡슐화된 웹 구성 요소에 게시합니다. 향후 이 기능은 앱 및 소규모 프로그램 세대로 마이그레이션됩니다.

업데이트 이후 간단한 리뷰도 진행했습니다.

예를 들어 음악 제품에 대한 공식 웹사이트 생성:

1分钟做出苹果Vision Pro「官网」?上班8小时搞出480个网页,同事被卷疯了

패션 잡지 공식 웹사이트 생성:

1分钟做出苹果Vision Pro「官网」?上班8小时搞出480个网页,同事被卷疯了

호텔 관리 백엔드 페이지 생성:

1分钟做出苹果Vision Pro「官网」?上班8小时搞出480个网页,同事被卷疯了

생성된 결과로 판단하면 기본적으로 웹 페이지의 콘텐츠 요구 사항을 충족할 수 있지만 성숙하고 전문적인 웹 페이지와는 여전히 일정한 격차가 있습니다. 그러나 그것은 결국 학습 과정에서 여전히 새로운 것이기 때문에 이해할 수 있습니다.

Vincent Tu와 달리 UI 디자인 초안은 고도로 표준화되어야 하며 편집 가능한 기능이 있어야 합니다. 따라서 Vincent UI 디자인 초안의 프로세스는 Vincent UI에 중점을 둔 Vincent Tu보다 약간 느립니다. 그리고 Uizard는 아직 비공개 베타 버전입니다.

UI 디자인 30년

ChatGPT의 갑작스러운 인기와 함께 AI 기반 디자인 도구도 미친 듯이 가속화되기 시작했습니다.

5월 24일 Adobe는 한 번의 클릭으로 화면 콘텐츠를 제거하거나 수정하고 이미지 콘텐츠를 확장할 수 있는 새로운 PS 기능인 Generative Fill을 출시했습니다. 이는 Stable Diffusion의 Inpainting 및 Outpainting과 동일합니다.

이 새로운 기능은 현재 Adobe Firefly에서 사용할 수 있으며 Photoshop 베타 버전에 내장되어 있습니다. 사용자는 PS에서 직접 비파괴적인 방식으로 이미지를 결합하거나 생성할 수 있습니다.

이에 따라 Google Research에서는 지난 6월 Muse 모델을 기반으로 한 새로운 애플리케이션인 StyleDrop을 출시했습니다.

사진의 다른 내용에 영향을 주지 않고 미세 조정을 위해 생성된 사진을 작은 범위로 제한할 수 있습니다. 예를 들어 사진의 색상, 그림자 효과, 스타일 등을 변경합니다. 미세 조정에 필요한 훈련 매개변수는 전체 모델의 1% 미만입니다.

1分钟做出苹果Vision Pro「官网」?上班8小时搞出480个网页,同事被卷疯了

오늘날의 AI 디자인 소프트웨어는 UI 디자인 초기를 생각하면 한숨이 나올 정도로 정교해졌습니다.

시간은 애플이 스티브 잡스가 직접 개발한 매킨토시를 출시한 1984년으로 거슬러 올라갑니다. 매킨토시는 컴퓨터 역사상 기념비적이라고 할 수 있는 GUI(Graphical User Interface)를 컴퓨터에 통합시켰습니다. 실제 제품이 나타납니다.

1分钟做出苹果Vision Pro「官网」?上班8小时搞出480个网页,同事被卷疯了

PS가 제작한 첫 번째 사진은 John Knoll이 "Jennifer in Paradise"라고 명명했습니다.

1987년, Macintosh 컴퓨터가 회색조 이미지로 흑백을 표시할 수 없었기 때문에 Thomas Knoll 이 문제를 해결하기 위해 디스플레이 프로그램을 직접 작성했습니다. 나중에 John Knoll이 합류했고, 두 형제가 함께 작업하여 제품을 다듬었고, Display는 나중에 Photoshop으로 이름이 바뀌었습니다.

1990년, 크기가 800kb에 불과한 Photoshop 1.0이 출시되면서 이 소프트웨어가 30년 이상 이미지 편집 분야를 장악했던 시대가 시작되었습니다.

2007년 애플 CEO 스티브 잡스가 아이폰을 출시했고, 2009년에는 아이폰 3GS, 2010년에는 아이폰 4가 출시됐다.

Retina HD 화면(Retina 디스플레이)이 장착된 최초의 휴대폰인 iPhone 4의 디스플레이 효과는 놀랍습니다. 사진과 텍스트가 인쇄물과 비슷할 정도로 깨끗하고 선명해 보입니다.

iPhone의 출현은 모바일 인터넷을 시작했으며 모바일 인터넷 시대의 많은 시각적 디자인 원칙을 정의했습니다.

2008년 네덜란드 트벤테 대학교에서 컴퓨터를 전공하는 Peter Omfli에게 간단한 그리기 애플리케이션 디자인을 의뢰받았고, DrawIt이 탄생했습니다.

DrawIt의 마지막 버전은 2010년 12월에 출시되었으며 소프트웨어 이름은 Sketch로 변경되었습니다. 그 이후로 Sketch는 작지만 충성스러운 추종자들을 모았습니다.

1分钟做出苹果Vision Pro「官网」?上班8小时搞出480个网页,同事被卷疯了

2009년 5월 28일, Google은 Google Wave 애플리케이션을 내부적으로 육성하고 공식적으로 출시했습니다. Google Wave 애플리케이션에서 사용자는 웨이브를 만든 다음 일부 사용자를 추가할 수 있습니다.

사용자 웨이브의 모든 사람은 서식 있는 텍스트, 위젯, 이미지는 물론 외부 피드까지 사용할 수 있으며 웨이브에 직접 응답하거나 편집할 수 있습니다.

제품이 나중에 종료되었지만 HTML5를 둘러싼 기술, 서비스 및 도구가 계속 등장했으며 점점 더 많은 SaaS 서비스가 브라우저와 같은 경량 클라이언트를 사용하여 사용자에게 제공하기 시작했습니다. 클라우드에 위치한 서버에서 처리됩니다.

거대 UI 디자인 도구인 Figma가 이 노드에서 탄생했습니다. Figma는 온라인 협업 디자인 소프트웨어로, 2016년 공식 버전이 출시되었고, 2017년부터 유료 패키지가 출시되기 시작했습니다. 이때 UI/UX 디자인 분야에서는 Adobe XD, Sketch, Figma 간의 경쟁 관계의 프로토타입이 구체화되었습니다.

전염병이 발생한 지난 몇 년 동안 모든 플랫폼에서 사용할 수 있는 온라인 인터페이스 디자인 협업 도구로서 온라인 협업에 대한 수요가 계속 증가함에 따라 Figma는 언제든지 프로젝트를 클라우드에 저장할 수 있으며, 2021년 6월 2억 달러의 자금 조달을 완료한 후 Figma의 가치는 100억 달러에 이르렀습니다.

2022년 9월 15일 Adobe는 공식 웹사이트를 통해 온라인 협업 디자인 플랫폼 Figma를 약 200억 달러(현금 절반, 주식 절반 포함)에 인수하겠다고 발표했습니다. Adobe의 경우 Figma를 인수하면 클라우드에서 비즈니스를 확장할 뿐만 아니라 잠재적인 가장 큰 경쟁자 중 하나를 제거하게 됩니다.

1分钟做出苹果Vision Pro「官网」?上班8小时搞出480个网页,同事被卷疯了

그러나 기술 혁명은 언제나 예상치 못하게 찾아옵니다.

신세대 디자인 도구는 어떤가요?

새로운 기술 환경은 새로운 터미널을 낳고, 새로운 터미널은 새로운 상호 작용 논리를 낳고, 새로운 상호 작용 논리는 새로운 도구를 낳습니다.

그리고 이제 디자인 도구에도 인공지능이 개입하게 되었습니다.

1分钟做出苹果Vision Pro「官网」?上班8小时搞出480个网页,同事被卷疯了

PS를 시작으로 디자인 도구의 발전 추세는 "단일 도구 기능"에서 "다중 기능", "기능 차별화 도구"를 거쳐 마침내 "도구 기능"과 "사용 시나리오"로 바뀌었습니다. 그러나 이러한 개발 추세가 어떻게 분할되고 결합되는지에 관계없이 주요 주제는 항상 디자인이 더 많은 문제를 더 잘 해결하는 데 도움이 되는 도구의 기능과 성능을 개선하는 것이었습니다.

AI 디자인 도구의 차이점은 무엇인가요?

"인공지능이 디자인 도구에 개입한 이후 도구 사용 시나리오 통합 및 도구 통합 추세가 더욱 가속화되었습니다. 또한 도구의 기능과 성능도 더욱 크게 향상되었습니다. 디자인 도구는 주로 사용자의 문제를 해결합니다.

과거에는 디자인 도구가 각 단계마다 사용자 참여가 필요했고 사용자도 결과 생성 로직을 알고 있었지만 이제는 원스텝 구현 프로세스가 되었습니다. "라고 Instant Design의 공동 창업자인 Zhou Ning이 말했습니다.

AI 디자인 도구를 검색하면 더 이상 텍스트로 생성된 이미지에 국한되지 않고 사진, Vincent UI 디자인, Vincent 3D, Vincent 비디오...

워크플로가 어떻게 바뀔까요?

우리는 새로운 도구를 사용하여 작업과 결과의 미래를 엿봅니다.

인터넷 제품 탄생을 위한 일반적인 생산 및 연구 과정은 다음과 같습니다. 디자인이 확정된 후 디자인 초안이 프론트 엔드 엔지니어에게 전달되어 디자인 언어를 프로그래밍 언어로 복원한 다음 이를 바탕으로 기능 개발을 진행합니다.

즉, "제품-디자인-프런트엔드-백엔드"입니다.

이제 디자인 초안을 온라인 제품으로 직접 변환할 수 있는 기능이 있으므로 디자이너는 더 이상 다음 링크에서 급우와 조정하는 데 시간을 소비할 필요가 없으며 프로그래머는 더 이상 언어 교체 작업을 할 필요가 없습니다. 검토, 개발, 검토 및 기타 측면을 검토하고 설계부터 개발까지 효율성을 향상시킵니다.

동시에 디자인 초안의 모든 수정 사항은 게시된 웹 페이지에 자동으로 업데이트될 수 있기 때문에 프로그래머는 처음 온라인에 접속할 때 프론트 엔드 처리만 수행할 수 있으며 별도의 작업을 수행할 필요가 없습니다. 향후 웹페이지의 유지 및 수정에 개입합니다.

실시간 디자인 전략 이사인 Li Jianing은 공개 연설에서 "사용자가 UI 디자인 초안을 받은 후에 무엇을 해야 합니까? 당연히 개발 학생들이 디자인 언어의 전환을 앱에서 깨닫게 해주세요."라고 말했습니다. 그래서 우리는 실시간 디자인과 결합하여 디자인 초안을 프런트 엔드 웹 페이지로 자동 변환하는 기능을 구현합니다.

이 일련의 기능을 결합하여 마침내 온라인 웹 사이트 생성 제품을 구현했습니다. 텍스트 설명을 통해 한 번의 클릭으로 미니 프로그램을 제공합니다. 사용자에게 개별 기능을 제공하지 않고 이러한 기능을 시나리오를 기반으로 유기적으로 통합합니다.”

디자인 도구의 진화를 엿보세요

작업 경계와 디자인 역량의 과잉.

이 제품은 디자인 능력이 없는 사람도 디자인 능력을 가질 수 있게 하고, 코딩 능력이 없는 사람도 코딩 능력을 가질 수 있도록 하는 제품입니다. 디자이너와 프런트엔드의 작업 경계가 점차 통합되고, 각 유형에 원래 할당된 역할 속성이 달라집니다. 작업은 자체 업스트림과 다운스트림으로 확장되었습니다.

AI 기능이 지속적으로 발전함에 따라 이 워크플로는 "제품 관리자-디자이너-백엔드" 또는 "제품 관리자-프론트엔드-백엔드" 또는 심지어 제품 관리자의 "황금 시대"로 단축될 가능성이 높습니다.

마찬가지로 디자인 도구가 지능화되면 디자인 도구를 사용하는 사람은 더 이상 전문적인 능력을 갖춘 사람이 아닐 수도 있습니다. AI를 사용하는 사람도 있을 수 있습니다. 과일가게 주인, 아침식사 가게 주인 등 누구나 인터넷을 좋아합니다. 콘텐츠 제작자, 인터페이스 디자이너, 애플리케이션 개발자가 될 수 있습니다.

기본적인 디자인 요구 사항을 충족하는 비용은 무시할 정도로 줄어들었고, 디자인 공급 측면에서도 폭발적인 발전을 가져올 것입니다. 과거의 긴 텍스트 설명 방식은 결국 "사진 한 장의 가치가 있습니다"라는 형태로 발전할 수 있습니다. 단어".

결국 우리에게 필요한 디자인 도구는 무엇인가요?

Zhou Ning은 다음과 같이 믿습니다.

"인공 지능이 디자인 도구에 완전히 개입하여 디자인 도구를 지능형 디자인 도구로 완전히 변환하면 우리의 원래 디자인 방법은 확실히 완전히 바뀔 것입니다. 이는 또한 생산성의 변화에 ​​따라 변화하는 객관적인 법칙

그래서 인공지능 생산성에 대한 좋은 기대를 바탕으로 설계 도구가 완전히 자동화되어 있고 기능과 성능에 다른 제한이 없다고 가정하면 최종 결과는 다음과 같습니다. 그 이유는 모든 프로세스 링크가 제거되고 도구의 모든 명시적 기능이 요구의 입력 끝과 결과의 입력 끝에 집중된다는 것입니다. 우리는 우리의 세부 요구 사항을 다양한 다중 모드 방식으로 설명하고 동시에 세부 사항에 대한 정확한 이해와 엄격한 구현을 달성할 수 있어야 합니다. 모호한 개념과 방향을 이해하려면 AI가 보유하고 있는 지식과 지능형 기능을 사용하여 요구 사항을 개선할 수 있도록 안내하고 지원해야 합니다. 더 높은 사고 차원

결과적으로 우리는 짧은 시간 내에 선택할 수 있는 고품질 다중 모드 솔루션을 많이 생성할 수 있어야 할 뿐만 아니라 또한 생성된 솔루션의 지속적인 최적화 및 반복에 대한 추가 요구 사항을 수용할 수 있어야 하며 심지어 AI가 자체 지식과 지혜를 사용하여 한 단계에서 가장 일치하고 완벽한 답변을 제공할 수 있기를 바랍니다. , 그리고 더 높은 차원과 수준에서 우리의 원래 요구에 대한 원래의 미적, 인지적 수준을 돌파할 수 있는 능력도 제공합니다."

Apple의 Vision Pro는 하룻밤 사이에 스타가 되었고, AIGC는 세계적인 히트작이 되었으며, 새로운 기술의 물결이 다가오고 있습니다. 우리는 다음 황금 시대가 어떤 모습일지 알 수 없습니다.

하지만 우리가 알 수 있는 것은 "정적인 환경에서는 새로운 기회가 부족하다. 새로운 기회는 모두 변화 속에서 탄생한다"는 것이다.

위 내용은 Apple Vision Pro '공식 웹사이트'를 1분 안에 만드시겠습니까? 직장에서 8시간 만에 480개의 웹페이지를 만들었고 동료들은 열광했습니다.의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨:
원천:51cto.com
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿
회사 소개 부인 성명 Sitemap
PHP 중국어 웹사이트:공공복지 온라인 PHP 교육,PHP 학습자의 빠른 성장을 도와주세요!