본문 바로가기 메뉴 바로가기

찐망고'S 퍼블리싱그리고디자인

프로필사진
  • 글쓰기
  • 관리
  • 태그
  • 방명록
  • RSS

찐망고'S 퍼블리싱그리고디자인

검색하기 폼
  • 분류 전체보기 (296)
    • WEB (131)
      • HTML기초 (19)
      • HTML이론 (17)
      • CSS (44)
      • JS이론 (15)
      • JS코드 (19)
      • FONT (15)
    • 플러그인 (17)
      • slick (3)
      • swiper (14)
    • 자격증 (8)
      • 웹디자인개발기능사 (8)
    • UIUX디자인 (88)
      • 디자인 (56)
      • 피그마 (23)
      • 포토샵 (9)
    • AI (22)
      • AI사주웹서비스 (17)
      • 미디어 (4)
    • 클래스 (17)
      • 수업노트 (16)
    • 나 (13)
      • 시선과기록 (13)
  • 방명록

ClaudeDesign (2)
STEP 05. Claude 인터랙션 - Artifacts 기반 실동작 프로토타이핑

이전 글에서 디자인 시스템은 팀이 같은 언어를 쓰게 만드는 구조라고 했다.시스템이 잡히면 다음은 프로토타입이다. 프로토타입에는 두 가지가 있다.피그마에서 화면 간 흐름만 연결한 클릭 프로토타입과,실제로 코드가 돌아가는 실동작 프로토타입.클릭 프로토타입은 흐름을 검증하는 데 충분하지만,스크롤 애니메이션이 어떻게 느껴지는지,FAQ 아코디언이 자연스러운지,모바일에서 터치가 편한지는 코드가 돌아가야 알 수 있다.예전에는 이걸 확인하려면 개발자가 직접 만들어야 했는데지금은 Claude의 Artifacts로 기획 단계에서 바로 실동작 프로토타입을 뽑을 수 있다. Artifacts에 "랜딩페이지 만들어줘"라고 하면 뻔한 게 나온다.그럴듯해 보이지만 어디에도 쓸 수 없는 결과물이다.AI한테 좋은 결과를 받으려면 좋은 ..

클래스/수업노트 2026. 7. 19. 09:00
STEP 03. 찐망고 사례로 배우는 Figma AI & MVP 설계

STEP 02. AI 데이터 UX 리서치 — 정책서 없이 만들었더니 생긴 일STEP 01. AI 서비스 기획 기초 — 문제 정의부터 CRUD 설계까지보통 사주보러가면 물어보는 것들이 있다. 올해 재물운이 어떻고 연애운이 어떻고재회운이 어떻고 하는 그런 것들사주명식에는 보통uiweb.tistory.com 이전 글에서 리서치는 안하면 결국 나중에 두번일하는 것이라고 정의했는데그 다음은 화면을 그리는 단계다정석대로라면 Figma에서 와이어프레임을 잡고, Hi-Fi로 올리고, 프로토타입으로 흐름을 검증한 다음에 개발로 들어간다.화면설계없이 코드를 치면 중간에 구조를 뜯어고치게 될 수 밖에 없다.하지만 찐망고 사주는 피그마를 안썼..입력폼하나, 결과화면하나, 마이페이지하나 홤녀이 세게인 서비스가 이미 머릿속에 있..

클래스/수업노트 2026. 7. 17. 09:00
이전 1 다음
이전 다음
공지사항
최근에 올라온 글
최근에 달린 댓글
Total
Today
Yesterday
링크
  • 찐망고AI사주풀이
  • What Was IT
  • W3Schools Online Web
  • 대한민국 공식 가이드라인
  • HTML최신버전
  • UI/UX레퍼런스
  • Unsplash
TAG
  • 찐망고사주
  • 피그마
  • JavaScript
  • 2024웹디자인
  • CSS3
  • 구글머터리얼디자인
  • uiux
  • 웹접근성
  • 디자인시스템
  • seo
  • UX디자인
  • 찐망고
  • 웹디자인팁
  • 서비스기획
  • 티스토리챌린지
  • ai사주
  • UI디자인
  • 웹디자인
  • 반응형웹
  • 웹퍼블리싱
  • 바이브코딩
  • 디자인팁
  • figma
  • 머터리얼디자인
  • html
  • 오블완
  • css
  • 웹표준
  • 웹디자인개발기능사
  • 프론트엔드
more
«   2026/07   »
일 월 화 수 목 금 토
1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29 30 31
글 보관함

Blog is powered by Tistory / Designed by Tistory

티스토리툴바