웹기획을 위한 도구 경험
Balsamiq , Power Mockup(추천), Oven
웹페이지는, 흔히 생각하는 것보다는 훨씬 많은 노력이 들어갑니다.
XML이라는 말이 개발자들 사이에서 나오기도 전인, 00년대 초만 하더라도 웹은 사용자 눈에 보이는 것이기 때문에 까다롭기 그지 없는 작업이었다고 기억합니다.
변변한 도구 없이, 메모장에 HTML 로 날코딩을 해서 HELLO 를 띄워서 뿌듯해 하던 제가 생각이 납니다.
주로 SI 프로젝트를 진행하게 되면, 그 당시만 해도 웹을 기준으로 결과를 보여주길 원했습니다.
설치하는 것 보다는, 사후 관리가 상대적으로 쉬우니까요.
백단에서, 수 십가지의 레거시 시스템들과 연동이 된다 한 들, 사용자는 이쁘게 나오는 웹페이지 하나만 중요할 뿐이니까요.
그래서, 더더욱 웹은 어렵습니다.
어플리케이션을 위주로 지내다 보니, 웹 세상에서는 꽤 오랜기간 동안 멀어져 있었습니다.
참 많이도 변했군요. 하지만, 기술이 바뀌어도 변하지 않는 일들은 있게 마련입니다.
스스로 개발을 하든, 외주를 주든 정확한 결과를 만들어내기 위해서는 고민이 필요합니다.
그 고민을 정리하고 담아내는 과정이 기획이라고 생각합니다.
물론, 만들어낸 결과는 완벽한 기획에도 불구하고 생각과 다르고, 다듬어가는 과정이 또한 필요합니다만, 다듬는게 가능한 결과물이냐 아니냐는 기획을 잘했냐 대충했냐에 따라 달라지기 때문에 더더욱 기획이 중요합니다.
요새는, 그림을 그리는 도구들이 워낙에 많더군요.
여러가지 기획을 위한 툴들이 클라우드 서비스로 출시가 되고 있습니다.
저는, 발사믹과 오븐 두 가지를 활용해 보았습니다.
발사믹 홈페이지먼저 Balsamiq 은, 꽤 유래가 오래된 툴입니다. 화면을 상상하며 그려볼 때 실제 펜으로 그리는 듯한 느낌을 주기 때문에, 개발자들이 선호하는 스타일이기도 합니다.
도구 화면굳이, 여러가지 기능을 넣지 않아도 직관적으로 알 수 있도록 하고 각 콘트롤별로 옵션이 굉장히 많습니다. 보기엔 단순해 보여도 굉장히 세세하게 조절할 수 있는 것이 장점입니다.
궁금하신 분들은, 이메일 정보를 팔아서 잠깐 써보시는 것도 좋습니다. 발사믹의 장점은 단순함입니다.
https://balsamiq.com/wireframes/
두 번째로는, 네이버에서 만들어 놓은 OVEN 입니다.
오븐 홈페이지사실, 비슷한 툴들은 굉장히 많습니다. 관련된 내용을 소개해 주는 사이트를 하나 소개해 드리죠.
https://dzone.com/articles/27-open-source-web-ui-mockup-tools
여기 가보시면, 굉장히 다양한 종류의 툴들이 존재합니다. 한번 씩 눌러보시고 느낌을 봐보시는 것도 나쁘지 않겠습니다.
하지만, 영어라는거에 거부감이 있으신 분들은 별로..일수 있죠.
그래서,! 네이버가 준비했습니다~!... (참 , 안끼는거 없이 다 하네요..)
프로젝트 만들기
작업화면발사믹보다는 좀 더~ 단순화 되어 있습니다. 생각보단 별 기능은 없습니다. 미리 정의된 컨트롤 들을 위치하고 그 안에 표시되는 텍스트 정도 바꿀 수 있는 정도라고 보시면 됩니다. 한 가지 실제 구동되는 사이트처럼 웹을 따로 하나 더 띄워 볼 수 있는 장점은 있습니다.
별도의 브러우저를 띄운 화면고객에게 단순하게 샘플로 이런식이다라는 정도 만들어서 보여주기에 부담없습니다.
그리고, 무료~란 장점도 있네요.
마지막으로, PowerMockup 이라는 도구를 소개합니다.
실제로 현업에서 고객이든 보고든 하기 위해서 가장 많이 쓰는 것이 파워포인트일 것입니다.
파워포인트는 명실상부한 보고용? 툴이죠. 요새는 가로가 식상하니 세로로 된 제안서도 유행인 듯 합니다만, 보는 사람이 편한것도 있지만, 실은 작성하는 사람이 편리하게 쓸 수 있다는 것이 더 장점이지 않을까 생각합니다.
과거에는 그래서, 파워포인트에 그림을 네모 세모 동그라미 선을 이용해서 일일이 그려야 했습니다. 따로 Visio 같은 친구를 쓰면 참 좋은데, 비싸죠...
비싸지만 좋은 툴 비지오~누군가 필요하면, 또 누군가는 그걸 만들어 내는 것이 IT 월드 아닐까요. 그래서, 찾아냈습니다.
PowerMockup!!
파워목업 홈페이지비지오를 사용하듯이, 미리 정의된 기획에 필요한 도형들이 미리 정의가 되어 있습니다. 파워포인트에서 다룰 수 있다는 것은, 일반 사용자에게 굉장히 큰 이익입니다. 늘 쓰던 도구에 꼭 필요한 기능을 얹어주는 방식이니까요.
목업 도형을 활용한 화면
오른쪽에 필요한 도구를 끌어서 파워포인트 화면에 놓고 쓰면 됩니다. 필요한 경우, 옵션도 제공해서 보고서를 작성하기가 훨씬 수월합니다.
더 좋은 것은, 필요한 몇가지를 만들어 놓고, 저장해 놓고 언제든 불러다 쓸 수 있다는 것입니다.
늘상 가져다 놔야하는 경우에는 정말 편한 기능인 듯 합니다.
Add to PowerMockup 으로 추가파워포인트로 기획서를 작성하거나, 스토리 보드를 작성하는 경우가 대부분인 현실을 감안하면, 저는 PowerMockup 을 추천하고 싶습니다. 약간의 비용이 들긴 하지만, 비용보다 마음의 평화가 더 소중한 법이니까요.
결국, 빠른 시간안에 원하는 결과물을 만들어내기 위한 도구들인 만큼 본인에게 가장 맞는 것을 골라서 작업하는 것이 최고인 듯 합니다.
