Layerz 4.0: 프로젝트 전체를 담은 하나의 사이드바

Layerz 4.0은 처음 출시한 이후 에디터에 생긴 가장 큰 변화입니다. 세로 탭바와 섹션마다 따로 있던 목록이 사라졌습니다. 그 자리에 프로젝트 전체를 담는 하나의 사이드바, 시스템이 정한 자리에 놓이는 인스펙터, 그리고 iPad·Mac·iPhone에서 같은 방식으로 읽히는 에디터가 들어왔습니다. 무엇이 바뀌었고 왜 바꿨는지 정리했습니다.

프로젝트 전체가 하나의 사이드바에

지금까지는 화면, 데이터, API, Action Flow 사이를 오가려면 탭을 바꿔야 했고, 탭마다 자기 목록이 따로 있었습니다. 4.0은 이것을 하나의 아웃라인으로 바꿨습니다. App Info, Screens, User Components, Design System, Assets, Data, Data Schema, API, Services, Action Flows가 나란히 있고, 각 항목이 그 아래에 접혀 있습니다. Data Schema에는 직접 만든 스키마와 내장 스키마, Enum, Transformer가 함께 보이고, API 컬렉션은 태그로, 태그는 엔드포인트로 펼쳐집니다.

어떤 행이든 선택하면 바로 열립니다. 하이라이트는 에디터가 보여주는 항목을 따라가므로, 무언가를 추가·삭제·복제한 뒤에도 사이드바는 늘 제 위치를 가리킵니다. 순서 변경, 스와이프 삭제, 컨텍스트 메뉴(복제, 시작 화면 지정, 탭 컨테이너 만들기)가 아웃라인 안에서 그대로 동작하고, + 메뉴로 어디서든 어떤 종류의 항목이든 추가할 수 있습니다.

문서 창은 이제 시스템 split view입니다. 사이드바가 기기의 다른 사이드바와 똑같이 움직인다는 뜻입니다. 접고, 너비를 조절하고, 그 상태를 기억합니다.

인스펙터 컬럼, 그리고 필요한 자리의 Outline

iPad와 Mac에서 인스펙터는 오른쪽의 시스템 인스펙터 컬럼으로 옮겨갑니다. iPad는 내비게이션 바에서, Mac은 창 툴바에서 토글하며, 화면을 옮겨 다녀도 그 자리에 남아 있습니다.

화면을 편집하는 동안에는 그 화면의 Outline이 사이드바 아래쪽 절반에 나타납니다. 위에는 프로젝트, 아래에는 지금 화면의 뷰 트리. 가운데 divider를 드래그해 비율을 조절할 수 있고, 그 비율도 기억됩니다. 섹션을 바꿀 때 패널이 들락날락하는 애니메이션도 없앴습니다. 여러 화면의 전환이 아니라 하나의 작업 표면처럼 느껴지도록 한 것입니다.

Mac에서는 창 툴바에 사이드바·인스펙터 토글이 생기고, Library 버튼이 docking된 Library 패널을 보이거나 숨기며, 창을 원하는 만큼 좁힐 수 있습니다. iPhone은 단일 컬럼 에디터를 그대로 유지합니다. 내비게이션 바의 사이드바 버튼이 프로젝트를 시트로 열고, side toolbar의 outline 버튼이 Outline을 엽니다.

캔버스에서 바로 텍스트 편집

Label을 두 번 탭하고 바로 입력하세요. 진입하면 전체가 선택되고, Return은 줄바꿈, Esc는 취소, 바깥을 탭하면 확정됩니다. 문구 하나 고치려고 인스펙터까지 갈 필요가 없습니다.

캔버스에는 햅틱도 더해졌습니다. 요소를 집어 올릴 때, 정렬 가이드에 맞을 때 가벼운 진동이 오고, 제약 상수가 0에 딱 맞을 때는 조금 더 강하게 옵니다. 기기와 Apple Pencil Pro 모두에서 동작합니다.

차트 컴포넌트

Swift Charts 기반의 차트가 정식 컴포넌트로 들어왔습니다. 막대·선·영역·점·파이(도넛) 마크, 보간과 심볼, 누적/그룹 시리즈, 범례와 축 옵션까지. 숫자 배열이나 직접 만든 스키마의 배열을 바인딩하고 x, y, 시리즈 필드를 고르면 차트가 스스로 그려집니다. 바인딩 전에는 샘플 데이터를 보여주므로 스타일부터 잡을 수 있습니다.

예상한 곳으로 흐르는 데이터

탭 컨테이너가 각 페이지에 Screen Data를 실행 시점에 넘겨줄 수 있습니다. 인스펙터 → Container에서 페이지별로 필드를 바인딩하면, 페이지는 그 데이터가 이미 채워진 상태로 시작합니다.

복제한 화면이 드디어 복사본답게 동작합니다. 데이터 바인딩은 셀 안의 바인딩까지 그대로 살아 있고, Action Flow와 Service는 고유한 id를 받아 원본과 엮이지 않습니다.

For Each 안에서는 루프의 Output이 바인딩하는 자리, 즉 본문 액션 위에 놓이고, 본문의 Guard가 조건에 맞지 않으면 반복 전체를 끝냅니다. 끊어진 바인딩은 어디서나 같은 빨간 표시로 보입니다.

언제든 다시 보는 Quick Start Guide

메인 화면의 Tips 섹션은 고정된 Quick Start Guide와 서버에서 관리하는 목록으로 바뀌었습니다. 가이드는 온보딩의 "아홉 가지 구성 요소" 투어를 그 자리에서 다시 보여줍니다. 개요에서 항목을 탭하면 바로 이동하고, Done을 누르면 개요로 돌아옵니다. 한 번 읽고 끝내도 좋고, 개념이 헷갈릴 때마다 다시 와도 됩니다. 서버 목록의 행은 문서와 튜토리얼을 앱 안의 웹뷰로 열어 주므로, 앱 업데이트 없이 새 자료를 안내할 수 있습니다.

받기

Layerz 4.0은 iPhone, iPad, Mac용으로 App Store에서 받을 수 있습니다. 새 에디터는 문서에 자세히 정리되어 있습니다. 사이드바와 인스펙터는 인터페이스에서, 차트는 컴포넌트에서 시작해 보세요.

무엇을 만드시는지 들려주세요 — support@layerz.app.