번외. 수강생 포트폴리오 — 기획부터 배포까지, 2달 반만에 만든 것들

 
8편에 걸쳐 AI 서비스를 기획하고, 설계하고, 만들고, 배포하는 과정을 다뤄보았다
 
이번 기수 학생들은
기획부터 시작해서 디자인싱킹으로
서비스를 정의하고, 피그마로 설계하고,
직접 퍼블리싱해서 GitHub Pages에 배포했다.
수업에서는 ChatGPT, Claude, Gemini를 골고루 썼고
도구는 각자 알아서, 여기까지 2달 반이 걸렸다.
아래는 학생들이 만든 실제 결과물이다. 
 
온새미로 — 가족 농장 소개 사이트
학생의 부모님이 운영하는 실제 농장 사이트를 만든 케이스다.
가상 브랜드가 아니라 진짜 운영할 사이트라서
학생의 태도가 다른 프로젝트와 달랐다.
진짜 쓸 상황이 되면 디테일에 대한 기준이 올라간다.
Step 07에서 실배포가 기준을 바꾼다고 했는데,
이 학생은 기획 단계부터 그 기준이 적용된 케이스다.

온새미로 농장

 
 
LOOP — 마라톤 코칭 서비스 랜딩페이지
Step 05에서 기획 프레임 사례로 소개한 그 프로젝트다.
이 학생은 실제로 마라톤을 뛰는 러너다.
자기가 직접 운영했으면 하는 러닝 클래스를 기획하고 랜딩페이지를 만들었다.
타겟, 강점, CTA, FAQ까지 기획서를 먼저 잡고,
Claude Artifacts로 실동작 프로토타입을 검증한 다음 직접 퍼블리싱했다.
커스텀 커서, 스크롤 애니메이션, FAQ 아코디언까지 들어가 있다.
https://uu0920213-design.github.io/portfolio/loop/index.html

ALIGN LAW — 교통사고 전문 법률사무소
Step 05에서 "같은 기획 프레임으로 전혀 다른 업종의 결과물이 나온다"는 사례로 소개한 프로젝트다.
러닝 클래스와 같은 기획 구조로 법률사무소 랜딩페이지를 만들었다.
가상 브랜드지만 AI 사전 상담, 사건 집중,
처음부터 끝까지 함께하는 구조까지 실제 로펌 사이트처럼 설계했다.
Claude Design으로 시안을 잡고
직접 퍼블리싱한 결과물이다.

ALIGN LAW | 교통사고·보험분쟁 전문 법률사무소

 
 
앵그리포테이토 — 실존 브랜드 리디자인
실존하는 감자 스낵 브랜드의 사이트를 리디자인한
프로젝트다.
디자인 업계에서 실존 브랜드 비공식 리디자인은
흔한 포트폴리오 관행이고,
학습 목적의 리디자인이라는 것을 명시하고 있다.
실제 회사 정보는 가상 데이터로 교체했다.
브랜드의 톤을 유지하면서 구조를 새로 잡는 연습이 된 케이스다.
[앵그리포테이토 사이트 링크]
*본 사이트는 학습 목적의 리디자인 연습작으로 해당 브랜드와 무관합니다.
 
Bloom Moment — 기념일 리마인드 꽃 서비스
동네 꽃집에서 모티브를 얻어 기획한 가상 브랜드다.
단순히 꽃을 파는 사이트가 아니라
기념일 리마인더 서비스를 전면에 내세운
기획이 특징이다.
꽃집이 제공할 수 있는 가치를 재정의하고,
그걸 히어로 섹션부터 보여주는 구조로 설계했다.
[Bloom Moment 사이트 링크]
 
이 수업의 범위는 기획부터
디자인, 퍼블리싱, 배포까지다.
사이트에 들어간 챗봇도 UI 설계와 마크업까지는
이 수업에서 작업했고,
실제 동작하는 기능은 이어지는 개발 수업에서
완성된다.
이 학생들은 기획을 처음 해보고,
피그마를 처음 열어보고,
HTML을 처음 써본 사람들이다.
그런데 기획 프레임을 먼저 잡고,
AI로 검증하고, 직접 코드를 짜서 배포까지 했다.
중요한 건 AI가 만들어준 게 아니라는 거다.
AI는 막히는 지점에서 도움을 줬을 뿐이고,
기획은 학생이 했고, 코드는 학생이 짰다.
Step 06에서 "AI가 코드를 짜주는 게 아니라,
학생이 짜다가 막힌 자리를 AI가 뚫어주는 구조"라고 한 그대로다.
 
이 시리즈는 여기서 마칠 예정
8월 중순 지나 특성화 고등학교 친구들 수업을 하게 될 것 같다
1:1 포트폴리오 빌딩과 데모데이까지 커리큘럼에 들어가서 그 과정도 계속 기록할 예정
 
이 시리즈는 실제 운영 중인 서비스 
찐망고 사주를 사례로 AI 서비스 기획부터 
배포까지를 다루는 강의 노트입니다.

📌출강 및 커리큘럼 문의: spacejh72@gmail.com