Luna Whale AI Web Class · Resource

웹 레퍼런스 갤러리 Reference Board

AI에게 “이런 느낌으로”라고 말할 때 필요한 참고 자료실입니다. 게임, 교육, 디자인 시스템, 웹 갤러리, SaaS, AI 서비스 등 15개 분야의 실제 웹사이트 스크린샷과 링크를 모았습니다.

15분야별 레퍼런스 카테고리
90스크린샷과 외부 링크 카드
6각 분야마다 비교할 대표 사이트
01 Look첫 화면에서 무엇이 가장 먼저 보이는지 관찰합니다.
02 Structure제목, 이미지, 카드, 버튼이 어떤 순서로 배치되는지 봅니다.
03 Prompt마음에 드는 점을 색, 여백, 이미지, 버튼 같은 단어로 바꿉니다.
04 Check그대로 베끼지 않고 수업 목적에 맞게 바꿔 쓰는지 확인합니다.
Field 01

게임 공식 사이트

게임의 세계관, 대표 이미지, 구매/플레이 버튼, 뉴스 구조를 관찰합니다.

Field 02

게임 제작 도구

학생이 게임을 만들 때 참고할 제작자 문서, 튜토리얼, 커뮤니티 구조를 봅니다.

Field 05

포트폴리오·디자이너

작품을 소개하고 프로젝트 과정을 보여주는 방식에 집중합니다.

Field 06

디자인 시스템

버튼, 카드, 입력창, 접근성 같은 화면 부품을 정확히 설명할 때 씁니다.

Field 07

UI 패턴·컴포넌트

버튼, 카드, 입력, 온보딩, 결제 같은 구체적 화면 패턴을 찾습니다.

Field 08

교육·키즈

초등학생 대상 설명, 밝은 색, 쉬운 버튼, 학습 흐름을 참고합니다.

Field 09

문화·전시·뮤지엄

작품 갤러리, 전시 소개, 이미지 캡션, 스토리텔링 방식을 봅니다.

Field 10

뉴스·매거진

읽기 쉬운 본문, 기사 카드, 이미지와 제목의 위계를 관찰합니다.

Field 11

이커머스·제품

상품 카드, 가격, 구매 버튼, 브랜드 스토리 구조를 참고합니다.

Field 12

SaaS·생산성

디지털 도구를 소개하는 랜딩 페이지와 기능 설명 방식을 봅니다.

Field 13

AI 서비스

AI 도구가 기능, 예시, 사용 방법을 어떻게 설명하는지 봅니다.

Field 14

음악·영상·크리에이티브

음악, 영상, 창작 플랫폼이 미디어를 어떻게 보여주는지 참고합니다.

Field 15

공공·비영리

정보 신뢰도, 읽기 쉬운 안내, 캠페인 메시지 구조를 봅니다.