데스크톱 앱
여행 플래너 대시보드 디자인
Halcyon Cove에서의 6개 경유지 하루 일정을 구성합니다. 저장된 장소, 지도 위치, 도보 시간을 연결하세요.
LLM Arena 2026년 9월
케이스 노트- 모델
- Claude Opus 5
- 디자인 과제
- 드래그 앤 드롭 방식의 도시 당일치기 여행 플래너
- 결과물
- 데스크톱 앱
활용 분야
- 일정 계획장소, 운영 시간, 방문 소요 시간을 중심으로 하루를 구성합니다.
- 지도 기반 대시보드위치 선택을 눈에 보이는 경유지 순서와 연결합니다.
- 여행 상품 프로토타입실시간 여행 서비스를 추가하기 전에 계획 인터랙션을 먼저 테스트합니다.
주요 특징
- 세 가지 연결된 뷰장소 라이브러리, 도시 지도, 일정이 각 선택 항목을 공유합니다.
- 이름이 있는 6개의 시간 슬롯아침 식사부터 저녁까지의 구성이 하루에 인식하기 쉬운 구조를 부여합니다.
- 맥락적 장소 서랍계획을 벗어나지 않고 운영 시간을 확인하거나 경유지를 이동합니다.
- 가시적인 경로 비용도보 예상 시간이 연속된 경유지 사이의 이동 시간을 드러냅니다.
여행 계획 대시보드 살펴보기
1 / 3장소와 시간을 연결하는 여행 대시보드
Daybreak Atlas는 Halcyon Cove에서의 가상 하루를 세 가지 연결된 뷰로 구성합니다. 저장된 장소는 왼쪽에, 일러스트 도시 지도는 중앙에, 하루 일정(The Day)은 오른쪽에 배치됩니다. 지도는 경유지가 어디에 속하는지를 알려주고, 타임라인은 언제 방문할지를 알려줍니다. 두 가지를 모두 볼 수 있게 유지함으로써 장소 선택의 결과를 더 쉽게 비교할 수 있습니다.
장소 라이브러리는 단순한 이름 목록이 아닙니다. Gullwing Bakery는 오전 6:30~11:00의 운영 시간대를 가지며, 경로에 추가되면 '아침 식사에 포함됨(In Breakfast)'으로 표시됩니다. 동일한 장소가 이후 아침 식사 슬롯에 방문 소요 시간, '보기(View)' 및 '삭제(Remove)' 컨트롤과 함께 나타납니다. 이 반복적인 정체성이 탐색과 계획 사이의 연결고리입니다. 카드는 역할이 바뀌지만 이름은 바뀌지 않습니다.
운영 시간, 방문 소요 시간, 이동 시간을 분리하기
이 여행 플래너 대시보드 디자인에서 가장 유용한 부분은 시간 처리 방식입니다. 운영 시간대, 방문 소요 시간, 도보 예상 시간은 각기 다른 제약 조건을 설명합니다. 이것들을 하나의 모호한 시간으로 압축해서는 안 됩니다. 이 예시는 각각이 정보를 제공하는 결정의 위치 근처에 배치합니다.
| 시간 신호 | 표시 위치 | 독자가 판단할 수 있는 것 |
|---|---|---|
| 오전 6:30~11:00 | Gullwing Bakery 카드 및 장소 서랍 | 의도한 방문 시간대에 해당 장소가 열려 있는지 여부. |
| 35분 방문 | Breakfast 슬롯의 베이커리 | 이동 시간과 별도로, 해당 경유지에서 얼마나 시간을 할당할지. |
| ~10분 도보 | Verdant Steps Garden 이전 | 다음 경유지까지의 이동 시간이 계획에 얼마나 추가되는지. |
| 62분 도보 | Hidden Gardens의 The Day 요약 | 이 특정 6개 경유지 경로에서 이동 시간이 어떻게 누적되는지. |
추천 경로에서 의도적인 일정으로
'Surprise Me'는 방문자에게 빈 슬롯 6개를 채우도록 요구하는 대신 시작 경로를 제공합니다. 캡처된 Hidden Gardens 상태에서는 Gullwing Bakery를 시작으로 정원, 점심, 독서실 순으로 이어지는 시퀀스가 구성됩니다. 사용자에게 편집할 수 있는 구체적인 무언가를 제공하는 것입니다. 이는 여전히 제안일 뿐이며, 최적화되거나 지리적으로 정확한 경로라는 증거가 아닙니다.

장소 하나, 여러 유용한 진입점
저장된 장소 카드와 지도 핀 모두 상세 정보로 이어질 수 있습니다. 서랍에는 설명, 운영 시간, 일반적인 방문 소요 시간, 최적 슬롯이 결합되어 있습니다. 따라서 지도에서 시작한 사람도 라이브러리를 탐색하는 사람과 동일한 일정 결정을 내릴 수 있습니다.
이름 있는 목적지가 이동을 예측 가능하게 만듭니다
서랍은 현재 배정 상태를 보여주고, 아침 식사(Breakfast), 오전(Morning), 점심(Lunch), 오후(Afternoon), 일몰(Sunset), 저녁(Evening) 버튼을 제공합니다. 이로써 장소 이동이 발견해야 하는 제스처가 아닌 눈에 보이는 동작이 됩니다. 실제 서비스 버전에서는 점유된 슬롯을 교체하는 것도 확정 전에 동일하게 명시적으로 처리해야 합니다.
완성된 예시로 시작하기
Surprise Me 테마를 선택하고 경유지 순서를 지도와 함께 읽어보세요. 제안된 테마가 레이블만이 아닌 실제 장소 카테고리에 반영되어 있는지 확인하세요.
이동 전에 먼저 검토하기
장소 하나를 열어 운영 시간대와 사용 가능한 시간 슬롯을 비교하고, 이름이 있는 슬롯을 사용해 이동하세요. 타임라인과 경로에 나타나는 결과 변화를 따라가세요.
하루 전체를 검토하기
'Lock the Day'를 사용하기 전에, 채워진 슬롯 수와 전체 도보 합계를 비교하세요. 이것들은 완료 버튼을 실행 가능한 일정의 증거로 간주하는 것보다 더 유용한 최종 검토를 제공합니다.
이 여행 플래너 프로토타입이 보여주는 것
Halcyon Cove, 그 장소들, 도보 예상 시간은 모두 데모 콘텐츠입니다. 이 아티팩트는 로컬 프런트엔드 프로토타입이며, 실시간 지도·예약 서비스·다중 사용자 플래너가 아닙니다. 원래의 로컬 스토리지 동작은 격리된 Show Preview 환경에서 사용할 수 없으므로, 해당 환경에서 저장된 진행 상황에 의존해서는 안 됩니다. Claude Opus 5는 소유자의 내보내기와 함께 제공된 레이블이며, 독립적으로 검증된 벤치마크 결과가 아닙니다.
OpenDesign에서 여행 플래너 대시보드 디자인 만드는 방법
세 가지 연결된 뷰 기술하기
OpenDesign에 소규모 가상 도시를 제시하고, 장소가 라이브러리·지도·타임라인에서 각각 어떻게 표시되는지 구체적으로 지정하세요. 꾸밈 요소를 추가하기 전에 공유 장소 정체성을 먼저 정의합니다. 아래 프롬프트는 이 사례에서 영감을 받아 새로 구성한 디자인 연습용 프롬프트이며, 원본 생성 프롬프트가 아닙니다.
제안된 프롬프트가상 해안 도시를 위한 여행 플래너 대시보드 디자인을 만드세요. 따뜻한 종이 배경, 왼쪽의 컴팩트한 장소 라이브러리, 중앙의 일러스트 지도, 오른쪽의 하루 타임라인을 사용하세요. 아침 식사(Breakfast), 오전(Morning), 점심(Lunch), 오후(Afternoon), 일몰(Sunset), 저녁(Evening) 6개의 이름이 있는 슬롯을 제공하세요. 각 샘플 장소에는 운영 시간대, 일반적인 방문 소요 시간, 카테고리가 필요합니다. 지도 핀이나 라이브러리 카드를 선택하면 동일한 장소 서랍이 열려야 합니다. 명시적인 슬롯 버튼과 드래그 앤 드롭 방식 모두로 장소를 배정할 수 있게 하세요. 연속된 경유지 사이의 예상 도보 시간을 방문 소요 시간과 별도로 표시하고, 하루 요약에 합계를 포함하세요. 추천 경로 초기 상태와 최종 검토 상태를 포함하세요. 장소와 경로 예상값은 가상 데모 데이터임을 명시하고, 실시간 지도·예약·공동 편집·클라우드 저장을 암시하지 마세요.
대시보드 전체에 걸쳐 변경 사항 하나 추적하기
OpenDesign에 장소 하나를 다른 슬롯으로 이동하도록 요청하고, 카드 레이블·선택된 지도 핀·타임라인에 그 변경이 어떻게 반영되는지 확인하세요. 변경 전후 상태를 비교하고, 모든 곳에서 장소 이름과 소요 시간을 동일하게 유지하며, 대상 슬롯에 이미 경유지가 있을 때 어떻게 처리되는지 명시하세요.
맞지 않는 경로 테스트하기
배정된 슬롯 이전에 영업이 종료되는 샘플 장소를 사용하여, 디자인이 이 불일치를 어떻게 설명하는지 검토하세요. 더 작은 화면에서는 어떤 패널을 우선시할지 결정하고, 세 개의 데스크톱 컬럼을 폰 뷰포트에 억지로 압축하지 않고도 나머지 두 패널에 접근할 수 있게 만드세요.
내보내기 및 공유 링크 받기
완성된 디자인을 내보낸 다음, OpenDesign의 공유 기능을 사용하여 공유 링크를 받으세요. 별도의 브라우저 창에서 링크를 열고 의도한 버전과 해당 자산이 전송 전에 이용 가능한지 확인하세요.



