brunch

You can make anything
by writing

C.S.Lewis

by JunWoo Lee May 15. 2019

웹페이지 기획, 디테일에서 갈린다

Free-writing 기획 오답 노트

최근에 새로운 웹페이지를 만드느라 이번 3월에 완성했던 free-writing.org의 서버를 닫았다. 비용적인 측면, 사용자의 수를 고려했을 때 서버를 잠시 닫는 게 맞다고 생각했다. 근데 막상 닫으니 아쉬움이 크다. 그래서 이전부터 미뤄왔던 free-writing 기획 오답 노트를 하려 한다.


일단 애초에 오답 노트를 해야겠다고 확 느낀 건 아래의 웹사이트를 보고 난 후였다.

free-writing.org를 다 만들고 구글에서 비슷한 사이트가 있나 찾아보던 중 발견한 곳이다. 들어가보니 내 것과 똑같이 '자유롭게 쓰기'를 소재로 만들어진 웹페이지였다.


(자유롭게 쓰기는 글쓰기 연습법. 더 자세히 알고 싶다면 여기)


같은 아이디어를 어떻게 발전시켰을지 궁금해서 사이트를 이리저리 둘러보고 난 결론을 내렸다.


내가 발렸다.


분했다. 하지만 비교 분석해보며 참 많은 걸 배우기도 했다. 그냥 두면 까먹을 게 분명하니 이곳에 오답노트하듯이 풀어놔야겠다. 총 3개의 키워드로 나눠 풀이될 듯하다.


1) 아니, 자유롭게 쓰기가 뭔데?


대부분의 사람들이 '자유롭게 쓰기'가 뭔지 모른다. 그래서 자유롭게 쓰기가 뭔지 사용자에게 설명해줄 필요가 있다. 이 부분은 나도 알고 있었다. 그래서 자유롭게 쓰기의 개념과 효과에 대해 설명해주는 페이지를 제공했다. 하지만 더 깊게 생각하지 못해 해당 페이지를 잘못된 곳에 배치하고 말았다.


free-writing.org 흐름
회원 가입  >  메인 페이지  >  자유롭게 쓰기란?


사용자는 회원 가입을 한 후에야 비로소 자유롭게 쓰기가 뭔지 알려주는 페이지에 도달할 수 있었다.


생각해보면 참으로 거만한 흐름이다. 자유롭게 쓰기가 뭔지도 모르고 알 수도 없는 상황에서 과연 사용자는 기꺼이 회원 가입을 하려 할까?


반면에 free-writer.io에서는 첫 페이지에서부터 자유롭게 쓰기가 뭔지 알려준다.

freewriter.io

페이지의 상단엔 사이트 사용 방법을 알려주는 움짤이, 하단엔 텍스트로 된 자세한 설명이 있다. 사용자는 이 친절한 첫 페이지를 보고 설득되어 회원 가입을 하게 될 수도 있을 것이다.


freewriter.io의 제작자는 페이지의 필요성과 더불어 그것의 위치 또한 제대로 고려한 것이었다. 나도 앞으론 페이지마다 타깃이 각기 다르다는 점을 고려해서 위치를 정해야겠다.


2) 사용자의 능동성을 이끌어내는 장치들


'자유롭게 쓰기'의 핵심은 머릿속에 있는 생각을 멈추지 않고 써내려가는 건데 생각보다 쉽지 않다. 쓰다 보면 고치고 싶은 문장이 계속 생겨나기 때문이다. 그래서 익숙하지 않은 사람은 쓰다가도 자꾸 고치거나 중도에 포기하게 된다.


free-writing.org를 만들 때 어떻게 하면 사용자가 자유롭게 쓰기를 더 잘할 수 있을지 고민했다. 그리고 나온 아이디어가 텍스트 수정 및 삭제를 불가하게 만드는 것이었다. 못 고치면 어쩔 수 없이 자유롭게 쓰기를 하게 된다는 단순한 아이디어였다.


다소 강압적인 아이디어였지만 실제로 만들어보니 나름 효과가 있었다. 못 고치니까 어쩔 수 없이 자유롭게 쓰기를 하게 되더라라는 피드백을 받았다.


하지만 그게 끝이었다. 강압적인 방식은 사용자의 지속적인 행동을 이끌어내지 못했다. 한두 번 해보다가 어렵고 힘들어서 그만두는 사람들이 태반이었다.


그럼 freewriter.io는 어떻게 했을까?


나와는 다르게 사용자의 능동성을 이끌어내는 방식을 선택했다. 그에 해당하는 장치들을 살펴보자.


첫 번째

사용자가 자신의 일간 글쓰기 목표를 설정하도록 했다.

freewriter.io

초심자를 위해 하루에 750자를 권장하고도 있는데 이와 같이 사용자에게 명확한 목표를 심어주는 것은 동기부여에 도움이 될 듯하다.


두 번째

글을 쓰면 신비롭고 제법 괜찮은 음악이 흘러나오도록 했다.

freewriter.io

타이핑하는 페이지에선 위의 그림처럼 4가지 모드를 설정할 수 있다. 그중 Audio feedback을 켜면 글을 쓸 때 신비로운 음악이 흘러나오는데 타이핑을 멈추면 음악도 멈춘다.


음악이 괜찮기도 하고 또 음악을 끊기게 해서는 안된다는 의무감도 들어서 굉장히 흥미로웠다. 사용자의 능동적 행동을 효과적으로 이끌어내는 장치라는 생각이 들었다.


세 번째

결과물을 시각적으로 파악할 수 있도록 했다.


freewriter.io는 사용자의 글쓰기 결과물을 시각적으로 나타내준다. 내가 얼마나 썼는지가 눈에 확 들어오니 동기부여가 됐다.

freewriter.io

대표적으로 freewriter.io의 모든 페이지에서 보이는 위 그림의 보라색 막대는 사용자의 당일 목표 달성량을 나타낸다. 사용자가 사전에 설정한 일간 목표에 가까워질수록 보라색 막대는 오른쪽으로 나아간다. 이런 시각적 장치는 사용자를 자극하여 보다 더 많은 글을 쓰게 할 수 있다.


이외에도 마이 페이지에 가면 지금까지의 글쓰기 결과를 그래프의 형태로 확인할 수 있다. 내가 얼마나 썼는지 시각적으로 확인할 수 있으니 동기부여가 됐다.


나 또한 유사한 기능을 제공했지만 바(bar)나 그래프와 같은 시각적 툴을 활용하지는 않았다. 그래서인지 사용자에게 줄 수 있는 성취감이 크지 않았던 것 같다.


같은 결과물이더라도 어떻게 전달하느냐에 따라 차이가 크다는 점을 다음번 기획엔 반드시 고려해야겠다.


3) 웹페이지가 아닌 웹서비스 기획을 해라!


웹서비스에서 빼놓을 수 없는 것이 공유다. 그런데 나는 free-writing.org를 만들 때 공유 기능을 크게 고려하지 않았다. 사용자가 결과물을 공유하고 싶으면 알아서 하지 않을까?라는 나태한 생각뿐이었다.


그런데 freewriter.io는 달랐다. 글을 쓰고 나면 바로 나오는 것이 공유 기능이었다.

freewriter.io

사용자는 결과물을 트위터나 페이스북으로 공유할 수 있는데 자세히 알아보니 freewriter.io 트위터 페이지도 있었다.

보면서 반성을 하게 됐다. freewriter.io를 만든 고수는 웹페이지만이 아니라 트위터 페이지까지 만들어서 운영도 하는데 왜 나는 그렇게 하지 않았을까.


이것이 프로와 아마추어의 차이라는 생각이 들었다. 만들 때부터 어떻게 운영할지 고려해야 한다는 것을 몸소 배웠다. free-writing.org는 그저 웹페이지에 불과했지만 freewriter.io는 웹서비스였다.


앞으론 나도 웹서비스를 기획하는 사람이 되도록 노력해야겠다. 페이지 설계는 물론 향후 운영 방법까지 잘 기획해보자. 적당주의는 노노.


4) 결론


free-writing.org와 freewriter.io


두 웹페이지 모두 굉장히 마이크로하다. 총 페이지 수가 손에 꼽을 정도로 적고 기능이 대단한 것도 아니다. 하지만 그렇기에 더욱더 드러낼 수 있는 부분이 있으니 바로 디테일이다.


그런데 이번에 난 free-writing.org를 만들며 디테일한 부분까지 신경 쓰지 못했다. 그저 웹페이지를 완성해내기에 급급했던 것 같다. 그래서인지 만족스러운 결과물이 나오지 않아 아쉽다.


하지만 앞으론 다를 것이다. 코딩 실력도 조금씩 늘고 있고 이렇게 복기를 하면서 배운 점도 분명히 있다. 지금 만들고 있는 서비스에 배운 걸 하나씩 반영하면 보다 더 디테일한 서비스가 나오지 않을까 생각한다.


아쉬운 결과물에도 이렇게 점차 성장하는 맛이 있어 기분이 좋다.


加油!

매거진의 이전글 취준생이지만 코딩은 하고 싶어
브런치는 최신 브라우저에 최적화 되어있습니다. IE chrome safari