콘텐츠 구성도
정보를 페이지별로 구성하고 각 페이지의 역할을 정합니다. 방문자가 무엇을 찾을 수 있고 웹사이트가 질문에 어떻게 답하는지 보여줍니다.
서비스웹사이트 제작
웹사이트 제작
하나의 시스템으로 디자인하고 구축하는 다중 페이지 웹사이트입니다. 옵션은 랜딩 페이지와 동일한 원칙을 따릅니다. 표준 블록, 개별 스타일, 심층적인 개별 작업으로 구성되며 페이지 수와 수정 횟수에서 차이가 있습니다.
모든 페이지에
명확한 역할을 부여합니다.
비즈니스 웹사이트는 서비스, 프로젝트, 접근 방식 및 연락 방법 등 여러 내용을 설명해야 합니다. 각 내용의 위치와 방문자가 페이지 사이를 이동하는 방식을 정합니다.
각 페이지에는 고유한 목적이 있으며, 탐색 구조와 시각 시스템은 웹사이트 전체를 하나로 연결합니다.
하나의 제안과 주요 행동 하나를 한 페이지에 담으려면 랜딩 페이지를 살펴보세요.
웹사이트에는 무엇이 들어갈까요?
비즈니스와 콘텐츠를 중심으로 구조, 페이지 디자인 및 개발을 함께 계획합니다.
페이지 유형 및 탐색 구조
페이지 간 이동 경로와 각 유형에 필요한 레이아웃을 디자인합니다. 서비스, 프로젝트 또는 정보 페이지는 콘텐츠에 맞는 구조를 갖춥니다.
일관된 시각 시스템
타이포그래피, 색상, 이미지 및 반복 요소를 웹사이트 전반에 걸쳐 조화롭게 구성합니다. 선택한 작업 수준에 따라 개별 구성과 세부 작업의 깊이가 달라집니다.
반응형 React 개발
데스크톱과 모바일에 맞춰 페이지, 탐색 구조 및 합의된 상호작용을 구현합니다. React 개발은 Lite, SKARR 및 SKARR.PRO에 포함됩니다.
콘텐츠 관리 및 출시
콘텐츠 편집기가 포함되는 경우 고객님이 수정할 수 있는 항목을 정합니다. 합의된 페이지와 사용자 여정을 확인하고, 수정 작업을 마친 뒤 웹사이트 출시를 준비합니다.
각기 다른 페이지.
하나로 이어지는 경험.
Lips by Lara는 시술 정보, 실용적인 안내, 다음 단계로 이어지는 행동을 일관된 시각 언어로 하나의 웹사이트에 담습니다.
Lips by Lara.
서로 다른 페이지,
하나의 경험.
홈페이지는 클리닉을 소개합니다. 시술 페이지는 각 서비스를 설명합니다. 가이드는 방문자가 진료 전 필요한 정보를 제공합니다.
웹사이트 구조와 디자인, React 구현을 진행했습니다. 공통 탐색 구조와 시각 요소가 서로 다른 유형의 콘텐츠를 연결합니다.
고객님의 콘텐츠를
실제 작동하는 웹사이트로.
합의된 웹사이트를 React로 구현해 제공합니다. 서로 연결된 페이지, 반응형 레이아웃, 탐색 구조 및 작동하는 상호작용이 포함됩니다.
콘텐츠 편집기, 연동 및 인계 자료의 포함 여부는 범위에서 정합니다. 선택한 작업 수준에 따라 페이지와 시각 시스템의 개발 깊이가 달라집니다.
내
사이트
사이트
- React
- 반응형
- 최적화
- 탐색 구조
- SEO 기본 설정
- 디자인
비즈니스에서 출발해
하나로 연결된 웹사이트까지.
프로젝트의 배경과 자료를 공유해 주세요. 함께 페이지를 구성하고 디자인을 개발해 웹사이트를 제작합니다.
01
구조를 계획합니다
비즈니스와 고객층, 보유 콘텐츠를 논의한 뒤 페이지 구성, 우선순위, 필요한 연동 항목을 함께 정합니다.
02
페이지 시스템을 디자인합니다
시각적 방향과 페이지 레이아웃을 개발합니다. 콘텐츠가 어떻게 구성되고 페이지들이 어떻게 연결되는지 검토하실 수 있습니다.
03
개발하고 연결합니다
React로 웹사이트를 구현하고 합의된 콘텐츠와 인터랙션을 추가하며, 프로젝트에 포함된 시스템을 연동합니다.
04
검토하고 출시 준비하기
다양한 화면 크기에서 페이지와 방문자 이용 흐름을 확인하고, 포함된 수정 작업을 완료한 뒤 합의된 출시를 준비합니다.
세 가지 방식
으로 웹사이트를 제작합니다.
모든 옵션은 실제로 작동하는 React 웹사이트를 제공합니다. 페이지 범위, 디자인 방식, 개발 깊이를 비교해 보세요.
| 항목 |
Lite
템플릿 기반 디자인. 콘텐츠를 위한 확실한 기반.
$2,700
일회성
Lite 구매하기
Stripe 보안 결제 |
SKARR
맞춤형 페이지 디자인. 고유한 시각 언어.
$3,800
일회성
SKARR 구매
Stripe 보안 결제 |
SKARR.PRO
경험 전반의 모든 접점을 더 깊고 세밀하게.
$5,700
일회성
SKARR.PRO 구매
Stripe 보안 결제 |
|---|---|---|---|
| 구조 및 디자인 | |||
| 웹사이트 구조 | 웹사이트 구조 검증된 페이지 블록을 사용해 콘텐츠를 명확한 구조로 구성합니다. | 웹사이트 구조 비즈니스와 방문자를 고려해 구조와 페이지 구성을 디자인합니다. | 웹사이트 구조 합의된 구조, 방문자 경로, 세부적인 페이지 구성에 더 깊이 있게 작업합니다. |
| 페이지 | 페이지 최대 5페이지. | 페이지 최대 10페이지. | 페이지 페이지 수는 합의된 구조에 따라 정합니다. |
| 시각 시스템 | 시각 시스템 표준 블록 구성을 색상, 콘텐츠, 선택한 방향에 맞게 조정합니다. | 시각 시스템 개별 스타일, 공통 컴포넌트, 맞춤 디자인 페이지. | 시각 시스템 확장된 컴포넌트 시스템과 합의된 시각 및 인터랙션 디자인에 대한 더욱 세밀한 작업. |
| 실제로 작동하는 웹사이트 | |||
| 개발 및 내비게이션 | 개발 및 내비게이션 반응형 React 웹사이트 개발, 공통 내비게이션, 기본 SEO 및 분석 기능. | 개발 및 내비게이션 합의된 페이지와 방문자 이용 흐름을 연결하는 내비게이션을 갖춘 반응형 React 웹사이트 개발. | 개발 및 내비게이션 필요한 경우 맞춤 인터랙션과 추가 상태를 포함한 반응형 React 웹사이트 개발. |
| 콘텐츠 관리 | 콘텐츠 관리 콘텐츠를 웹사이트에 배치합니다. 편집 권한과 추후 업데이트는 프로젝트에 맞춰 논의합니다. | 콘텐츠 관리 필요한 경우 콘텐츠 관리 시스템을 제공합니다. 편집할 수 있는 자료의 범위를 정합니다. | 콘텐츠 관리 합의된 프로젝트 내용에 명시된 콘텐츠 관리 및 편집 절차. |
| 연동 | 연동 선택한 블록에서 제공하는 표준 기능입니다. 필요한 연동은 작업 시작 전에 확인합니다. | 연동 복잡한 시스템을 제외한 합의된 연동. | 연동 합의된 범위 내의 연동 및 더 복잡한 시나리오. |
| 결과물 및 수정 | |||
| 제공 항목 | 제공 항목 작동하는 웹사이트를 제공합니다. 별도의 Figma 파일이나 소스 파일, 디자인 시스템은 제공하지 않습니다. | 제공 항목 작동하는 웹사이트와 개별 시각 스타일이 적용된 Figma 파일을 제공합니다. | 제공 항목 작동하는 웹사이트와 필요에 따라 더 발전된 디자인 시스템을 제공합니다. |
| 수정 라운드 | 수정 라운드 1 | 수정 라운드 2 | 수정 라운드 4 |
시작하기
전에.
텍스트와 이미지를 모두 준비해야 하나요?
현재 준비된 자료를 보내 주세요. 기존 웹사이트와 브랜드 자료도 포함됩니다. 콘텐츠를 검토한 뒤 작성, 편집, 교체 또는 새로 제작해야 할 항목을 정합니다.
모든 단계에 React 개발이 포함되나요?
네. Lite, SKARR, SKARR.PRO 모두 실제로 작동하는 React 웹사이트를 제공합니다. 차이는 페이지 범위, 개별 디자인, 세부 작업의 깊이에 있습니다.
콘텐츠를 직접 수정할 수 있나요?
콘텐츠 관리가 포함된 경우 업데이트할 수 있는 페이지와 필드를 정합니다. 콘텐츠 편집기는 필요에 맞춰 범위를 정하며, 모든 패키지에 자동으로 포함되지는 않습니다.
어떤 디자인 및 소스 파일을 받게 되나요?
Lite는 별도의 Figma 파일, 프로젝트 소스 파일 또는 디자인 시스템 없이 실제로 작동하는 웹사이트를 제공합니다. SKARR에는 Figma가 포함되며, 필요한 경우 PRO에는 더욱 깊이 있는 시스템이 추가됩니다. 정확한 인도 항목은 합의합니다.
연동, 호스팅, 지원 범위는 어떻게 정하나요?
연동 항목은 각각 명시합니다. SKARR에는 복잡한 시스템이 포함되지 않으며, PRO는 합의된 복잡한 작업을 포함할 수 있습니다. 호스팅, 도메인, 액세스 권한에 대한 책임도 정합니다. 지속적인 지원은 별도의 범위를 합의합니다.
아직 궁금한 점이 있으신가요?
웹사이트 상담