스티치로 이동해서 다시 시작해 주세요. 스티치 안에서 더하기 아이콘을 클릭해 주세요.

두 가지 옵션이 보이실 겁니다. 사진을 업로드하시거나 웹사이트 주소를 제공해 주시면 됩니다.

참고 웹사이트 링크를 여기 붙여넣을게요. 다음으로 프롬프트를 추가할 거예요.

비디오에 사용된 모든 프롬프트는 아래 설명란에서 확인하실 수 있습니다. 따라 하고 싶으시면 참고해 주세요.

네, 꼭 복사해서 붙여넣으시기 바랍니다.

웹사이트 제작을 염두에 두고 생성하기 전에, 웹 옵션이 선택되었는지 확인해 주시기 바랍니다.

자, 생성 버튼을 누르시고, 잠시만 기다려 주시면 됩니다.

스치치가 첫 번째 레이아웃 버전을 만들었어요. 한번 미리 보죠. 솔직히, 정말 인상적이네요.

첫 번째에요.

첫 번째 버전입니다.

거의 대부분 초고는 수정되는 버전을 유지하지 않습니다. 바로 여기서 수정 과정을 거치게 됩니다.

프롬프트를 다듬고, 간격을 조정하고, 색상을 변경하고, 타이포그래피를 개선한 후 다시 생성해 주십시오.

각각의 변경 사항은 디자인에 더 가까워지도록 도와줍니다. 일단 완료되면, UI를 개선해 봅시다.

상단 메뉴 바를 추가할게요. 좋네요, 진짜 프로덕션 웹사이트처럼 느껴지기 시작하네요.

이제 상호작용 레이어를 강화해야겠어요. 이 사이트는 주로 즉각적으로 반응하는 방식으로 작동하니까요.

여기서부터, 정적인 이미지들을 영상으로 바꿔서 더 발전시켜 나가도록 하겠습니다.

각 패널 위로 마우스를 가져다 대면 텍스트가 동적으로 변경되도록 수정할 예정입니다.

처음 시도하면 완벽한 결과를 얻기는 어렵기 때문에 몇 번의 반복을 예상하게 될 거예요.

프롬프트를 다듬은 후에, 드디어 이런 결과가 나오는데, 훨씬 더 좋죠.

지금쯤 되면, 상호작용이 작동해야만 보이는 문제점들을 눈치채기 시작할 거예요.

모든 패널이 똑같이 반응하고 비슷한 미디어를 보여줄 때 반복적으로 나타나는 문제 말이죠.

사이트가 가짜 같기 시작하니까, 다음 단계는 각

각 패널이 뚜렷하게 느껴지도록 하는 거예요. 그래서 각 패널마다 뚜렷한 영상을 생성해서 고쳐야겠어요.

주요 경험이 제대로 느껴지니, 이제 참고 자료를 바탕으로 두 번째 모드를 추가합니다.

사이트에 완전히 다른 화면처럼 느껴지는 추가적인 섹션이 있습니다.

이것은 중요해요, 왜냐하면 사이트가 단발성 상호작용 트릭에서 탐색과 탐험이 가능한 완전한 인터페이스로 바뀔 수 있기 때문입니다.

다시 한번 말씀드리지만, 몇 번의 수정이 필요할 수도 있어요. 하지만 몇 번의 반복을 거치면 최종 결과가 나올 거예요.

여러 번의 반복을 거쳐 최종 결과를 얻었습니다. 완성된 디자인을 미리 살펴보겠습니다.

모든 것이 깨끗하고 인터랙티브해 보이네요. 완벽합니다. 이제 디자인...