brunch

You can make anything
by writing

- C.S.Lewis -

어바웃 어플리케이션
by 한상훈 Feb 18. 2017

웹 사이트 빌드 프로세스

웹 사이트 제작의 3단계 순서

원글링크: https://medium.com/@sanghunhan/website-build-process-4dd0413e17ca




왜 빌드 프로세스를 따라야 하는가?


모든 컴퓨터로 진행되는 프로젝트는 로직을 따른다. 레이아웃이나 폰트 같은 몇몇은 쉽게 바뀔 수 있지만, 구조를 바꾸는 것은 조금이라도 어렵다. 당신은 건축가에게 절대 이렇게 말하지 않을 것이다. "꽤 괜찮은 건물이네요. 그런데 약간만 이동했으면 좋겠어요. 2인치 정도 왼쪽으로 옮겨주실 수 있나요?"


 

1. 컨셉트

컨셉트는 당신의 필요사항, 목적, 도메인을 담는다. 필요사항은 이런 것이다. '댓글 추가하기 기능', '관리자 페이지', '시각화된 데이터 테이블', '소셜 API를 사용하기'. 명확한 요청은 당신과 프로그래머 모두에게 좋다. 왜냐하면 많은 함수(프로그래밍에서 사용되는)들은 서로 연결되어있기 때문이다. 그것은 모든 선택을 변화시킬 수 있다. 플랫폼, 오픈소스, 서버 성능 같은 것. 그렇다 모든것은 서로 영향을 준다.


2. 디자인 

웹사이트는 마치 건물과 같다. 장사를 위해서 당신은 건물을 임대할 수도 있지만 확장을 위해선 임대가 안 좋은 선택이 될 수 있다. 만약 당신이 초고층 빌딩을 원한다면 먼저 전문가들을 많이 고용해야 할 것이다. 디자인 절차는 다음의 절차를 밟는다.

사이트맵

레이아웃

스토리보드

메인 페이지

페이지들

데이터베이스


이것은 가장 기본적인 절차이다. 복잡한 구조의 사이트일 수록 절차들이 완벽히 수행되어야 한다. 사이트맵은 흐름과 기능을 보여준다. 이것은 방문자의 행동을 이끈다. 이때 기억할 점은 클릭을 최소화 하라. 사이트를 심플하고, 간결하게 만들라. 평범한 비즈니스 웹사이트가 미로 스타일인걸 바라는 사람은 아무도 없다. 그렇지 않으면 방문자들은 혼란을 느낄테고 5초동안도 머무르지 않을 것이다.


스토리보드는 근본적인 목적을 담는다. 레이아웃, 컬러, 폰트는 당신의 스토리를 반영할 것이다. 명확한 메세지를 가져라. 이것이 웹사이트 제작을 매우 쉽게 만들어줄 것이다.


메인 페이지는 첫인상이다. 모든 사람에게 중요하지만 웹사이트에게도 동일하다. 잘 분류된 네비게이션에 집중해라. 이해하기 쉽게 웹사이트를 정리하라. 광고를 최소화 하고 끔찍한 팝업은 없에라. 아무도 그걸 보고 싶어하지 않는다.


페이아웃과 페이지들은 유저 인터페이스와 유저 경험을 최대화 한다는 하나의 목표를 가진다. 어떤 사이트는 그리드 스타일을 가지고, 어떤 사이트는 수직이나 수평 형태의 레이아웃을 가진다. 폰트와 컬러는 사이트의 분위기를 변화시킨다. 이러한 모든 요소는 사용자의 편리함을 위해 제작되어야 한다.


마지막으로 데이터베이스 디자인이다. 이 과정은 데이터베이스를 만드는 절차가 아니라 설계 단계이다. 먼저 어떤 데이터가 필요한지, 필요없는지 선택한다. 동적 웹사이트는 다양한 타입의 데이터를 전송한다. 만약 당신이 웹사이트를 프로그래밍 하지 않는다면, 당신의 프로그래머에게 예상되는 데이터의 사이즈, 당신이 필요로하는 성능과 비용을 잘 이야기 해야한다.


3. 제작


제작은 최종 최적화이다. 다음의 절차가 요구된다.

프로그래밍

UI/UX(User Interface/User Experience)

테스팅

검색 엔진 최적화(SEO, Search Engine Optimization)

보안

스케일 컨트롤

옵션: 다국어 지원

오프닝


프로그래밍 단계는 예상치 못한 상황으로 인해 긴 시간을 필요로 한다. 만약 당신이 뛰어나고 디테일한 설계를 가지고 있다해도 프로젝트는 언제나 그렇지만 마무리가 어렵다. 프로그래밍 스탭은 디자인 스탭에 영향을 줄 것이다. 몇몇의 기능들은 삭제되거나 대체될 것이다. 그러나 이것은 받아들일만 하다. 가장 중요한 것은 당신의 사이트의 중심 가치이다. 당신은 이것에 집중해야한다.


UI/UX는 사이트의 중심가치를 돕는다. 그러니 최대한 사용자가 쉽게 만들어라.


테스팅 단계는 중요하다. 많은 아웃소싱 프로그래머는 외주 요청자가 관심을 가지지 않으면 테스팅을 실시하지도 않는다.   


퍼블리싱 혹은컨텐츠 기반의 웹사이트에게 있어서 검색엔진 최적화는 중요한 의미를 가진다. 이것은 방문자을 증가시키고, 구글 검색 엔진에 더 매력적으로 보이게 만든다. 이 부분은 긴 스토리와 공부를 가진다. 테스팅 단계 처럼 당신은 더 깊게 이것을 알아야할 필요가 있다.


보안은 일반적인 창업자들에게 힘든 부분이다. 이것을 이루기 위한 유일한 방법은 프로그래머를 괴롭혀라! 만약 고객 정보나 루트 권한을 잃게 된다면 당신의 웹사이트는 멸망의 날이 찾아온 것을 보게 될 것이다.


스케일 컨트롤은 스케일업과 스케일 아웃을 준비하는 것을 의미한다. 처음 시작할 때 모두들 작게 시작한다. 그러나 방문자가 늘어나고 트레픽이 커지면 당신의 웹사이트에 부하가 걸린다. 이것은 퍼포먼스를 감소시키고 심해지면 아예 방문자들을 막아버린다.


마지막으로 오프닝이다. 그렇다. 당신은 해냈다. 그러나 오프닝의 목적은 오프닝 자체가 아니다. 당신의 웹사이트는 오프닝 이후에도 많은 테스트를 거쳐가야하고, 조정을 할 것이다. 그러나 오프닝 이후엔 준비 단계보다 수정하는데 어려울 수 있다. 오프닝 단계는 다양한 위험요소들로부터 준비하는 단계라 할 수 있다. 그리고 많은 웹사이트 모델은 '네트워크 효과' 에 영향을 받는다. 이것은 사람을 모을 때 강력해진다. 이것은 전염성을 가지게 된다. 그러나 우리는 현재 한명의 맴버도 가지지 못했다. 만약 당신이 페이스북의 프로토타입을 제작했더라도 이것은 혼자서는 작동하지 않는다. 최소한의 시작 인원이 필요하다. 어떻게 당신은 런칭 전에 사람을 모을 수 있을까? 몇가지 방법이 있다. 테스터를 모집해라. 광고 혹은 요청으로 당신의 친척들, 친구들을 부르라. 당신이 웹사이트를 홍보할 때 타겟을 지혜롭게 선택하라. 페이팔의 초기 모습을 기억하라. 그들의 홍보와 서비스는 이베이의 메가 딜러라는 한 그룹에 촛점을 맞췄다.





프로세스는 이제 끝났다. 그러나 비즈니스는 이제 시작이다. 이것은 웹사이트 제작자들에게 있어서 반복적인 활동이다. 이제 당신도 그 안에 들어왔다. 당신이 웹사이트를 열 때 나에게도 알려달라.

keyword
magazine 어바웃 어플리케이션
소속에어데스크 직업CEO
안녕하세요! 에어데스크 만드는 한상훈입니다!
댓글

    매거진 선택

    키워드 선택 0 / 3 0
    브런치는 최신 브라우저에 최적화 되어있습니다. IE chrome safari