[기획] 2. 프로젝트 목표 설정하기

우선 큰 기획을 좀 해봅시다.

이 프로젝트가 뭘 하기 위한 서비스고, 그래서 어떤 기능이 필요하고, 어떤 페이지들이 필요한지만 정해보겠습니다.

 

제 서비스는 우선, 간단한 앱은 간단하게 만들 수 있는 걸 목표로 합니다.

예를 들어 상품을 홍보하는 간단한 앱을 만들고 싶을 때,

개발자는 일단 코드부터 작성하고 보면 된다지만, 간단한 걸 작성하는데 프로젝트 초기 설정부터 하는 건 좀 귀찮지 않습니까?

 

그래서 Wix, Framer 등 여러 도구가 존재하지만 Wix보다는 개발자 중심의, Framer 보다는 단순한 방식의 디자인으로

앱을 쉽게 만들고 배포하면 편하고 좋지 않을까 합니다.

사용자들이 만든 것들 좀 구경도 하고 그러면서 아이디어도 좀 얻어보고 그러면 좋을 것 같기도 하고요.

 

그래서

1. 다른 사용자들의 앱을 구경하는 기능이 필요합니다.
2. 앱을 만드는 기능이 필요합니다.
3. 만든 앱을 쉽게 배포하는 기능이 필요합니다.

가 큰 기능이 되겠습니다.

 

이에 따라서, 페이지도 앱 구경, 앱 제작, 앱 관리의 세 개로 갈 것 같습니다.

2번은 좀 더 구체적인 기획이 필요한데, 생각해 보겠습니다.

 

나는 보통 어떻게 앱을 생각해서 제작할까, 그리고 어떻게 쓰는 게 편할까.

보통 크게 레이아웃을 잡고, 하위에 컴포넌트 구성하면서 이미지, 인풋, 박스 등을 넣어 구성하는 것 같습니다.

자, 필수 기능도 정해졌네요.

1. 레이아웃을 설정하는 기능이 필요합니다.
2. 이미지, 인풋, 박스 등의 컴포넌트 삽입 기능이 필요합니다.
3. 컴포넌트에 매핑될 정보의 연동이 필요합니다.

그럼 편의 기능도 좀 있어야겠죠?

앱이면 아무래도 아래의 기능이 있어야지 않나 싶습니다.

1. 다이얼로그 오픈 기능이 필요합니다.
2. 팝업 오픈 기능이 필요합니다.
3. 링크 기능이 필요합니다.

어... 이 정도면 될까요?

편의 기능은 차차 늘려가는 걸로 합시다.

 

피그마로 대충 윤곽이나 잡아볼까요?

Wisiwig 에디터를 생각하기에, 피그마와 유사한 레이아웃을 가져가보겠습니다.

레이아웃

좌측은 앱의 페이지를 노출할 거고, 우측은 각 컴포넌트의 수정을 가능하게 할 겁니다.

상단은 삽입 관련 UI나 탭 기능이 들어가면 좋을 것 같아요.

에디터 페이지

대충 이 정도 느낌으로요.

아이콘은 아직 그리지 않았고, 페이지에 리사이즈 핸들이 달려서 반응형이 되었으면 좋겠어서 기능이 있을 거다라고 작성만 해뒀습니다.

뭔가 느낌이 나죠?

 

에디터는 이런 디자인이면 될 것 같고, 이제 프로젝트 관리, 구경하는 페이지의 대략적인 디자인이 나오면 좋겠습니다.

프로젝트 탐색 페이지

레이아웃은 어느 정도 유지하고, 거기에 탐색을 가능하게 프로젝트 이름과 생성 날짜만 노출했습니다.

어떤 내용이 노출되어야 할지는 차차 생각해 보기로 하고, 이런 느낌이면 좋을 것 같습니다.

비슷한 식으로 프로젝트 관리도 만들어질 거라 디자인은 일단 통일되었다고 생각하겠습니다.

 

그럼 총 세 페이지가 대략적으로 구성이 나왔고, 레이아웃 정도는 잡을 수 있을 것 같네요.

다음에는 클라이언트 구현으로 넘어가서 프로젝트 초기 설정, 레이아웃을 잡기까지 진행해 보고

어떤 순서로 기능을 쌓을지 고민해 보겠습니다.

 

피그마는 오랜만에 사용하니까 좀 어렵네요 역시..

클라이언트 구현이 좀 진행되면 백엔드도 맞춰 진행해 보려는데, 초기라 그런가 좀 재밌습니다.

회사가 요즘은 바쁘지 않아서 이때 빨리 진행하려는데 안 막히고 술술 나아갔으면 좋겠네요.