본문 바로가기

Technology

 (258)
웹에서 글 쓸 때, 이것만 체크하세요 요즘 워드프레스와 같은 CMS(Contents Management System)를 기반으로 홈페이지를 제작하는 경우가 많아지면서, 콘텐츠를 관리하기가 더욱 수월해졌습니다. 개발자나 제작사를 거치지 않고 직접 글을 게시하거나 편집할 수 있게 되었지요. 그래서 웹사이트 제작 프로젝트를 진행할 때 관리자의 글 편집 기능을 좀 더 신경 쓰게 되는데요. 슬로워크에서는 콘텐츠를 깔끔하게 정리하여 게시할 수 있는 본문 작성의 가이드를 드리기도 합니다. 가이드에 맞춰 공지나 새 소식에 게시할 글을 작성하면, 별도의 디자인이나 퍼블리싱 과정 없이 본문의 요소를 표현할 수 있습니다. 본문의 스타일을 고민하기에 앞서, 게시물의 원고를 준비하는 단계를 생각해봅시다. 스타일 가이드를 잘 만들어두었다고 해도, 원고의 적절한 가공..
스타일 가이드로 웹서비스 개발하기 들어가며 저는 슬로워크의 이메일마케팅 서비스 스티비의 프론트엔드 개발자입니다. 현재 스티비는 정식버전을 한창 개발하고 있는데요, 개편을 진행하면서 프론트엔드 개발 프로세스에 대해 많은 고민을 하게 되었습니다. 무엇보다 웹서비스는 유용하고 쓸만해야 합니다. 즉, 사용자에게 도움을 주면서 그 과정이 쉽고 편해야 합니다. 쓰기 편한 웹서비스는 명확한 UI를 제시하여 사용법의 학습이 쉽고, 한 번 학습하면 다시 익힐 필요 없도록 통일성있는 UI를 가져야 합니다. 오류와 경고를 표현할 때, 보통 오류는 빨간색으로 경고는 노란색으로 표현합니다. 하지만 어떤 페이지에는 빨간색이 너무 많이 쓰여서 예외적으로 오류를 보라색으로 할 수도 있을 것입니다. 이런 결정을 내리는 경우는 드물겠지만 과거의 방식처럼 웹서비스를 페이..
개발자와 대화하고 싶은 비개발자를 위한 참고서 슬로워크 블로그에서는 얼마 전, 비디자이너의 얕은 지식 쌓기: 디자인 용어 20에 대해 포스팅했습니다. 그 글을 보고 저 또한 개발팀 내 유일한 비개발자이기에 많은 영감을 받아 이번 글을 작성하게 되었습니다. 저는 웹기획자로 프론트엔드개발자 두 명, 백엔드개발자 한 명과 함께 팀을 이뤄 작업하고 있습니다. 개발자와 함께 일하기 역시 기본적인 용어를 알지 못하면 혼란스러운 상황(나는 누구? 여긴 어디?..)에 처할 수 있습니다. 고객들도 웹사이트 의뢰를 하면서 익숙지 않은 여러 용어에 낯설어 합니다. 저 역시 아직도 갈 길이 멀지만, 개발자와 소통하기 위한 넓고 얕은 개발용어 몇 가지를 안내해 드립니다. 프론트엔드개발자와 백엔드개발자는 어떻게 다른 건가요? 프론트엔드개발자 - 사용자의 화면에 나타나는 웹 ..
IoT도 DIY 시대! 우리집 온습도 측정기 제작기 우리는 현재 IoT의 세상에서 살아가고 있다고 말합니다. 그렇다면 IoT가 뭘까요? 위키피디아에서는 IoT를 다음과 같이 정의하고 있습니다. 사물 인터넷(Internet of Things, 약어로 IoT)은 각종 사물에 센서와 통신 기능을 내장하여 인터넷에 연결하는 기술을 의미한다. 여기서 사물이란 가전제품, 모바일 장비, 웨어러블 컴퓨터 등 다양한 임베디드 시스템이 된다. 사물 인터넷에 연결되는 사물들은 자신을 구별할 수 있는 유일한 아이피를 가지고 인터넷으로 연결되어야 하며, 외부 환경으로부터의 데이터 취득을 위해 센서를 내장할 수 있다. 따라서, IoT 세상을 쉽게 말하자면 “모든 것이 인터넷으로 서로 연결되어 있는 세상”이라고 할 수 있겠습니다. DIY IoT모든 것이 인터넷으로 연결되어 있는 세..
이메일마케팅 컨퍼런스의 왕중왕 <TEDC Boston> 이메일마케팅 컨퍼런스 중 최고의 권위를 자랑하는 The Email Design Conference 2016의 보스턴 행사(이하 TEDC)를 슬로워크 스티비팀에서 다녀왔습니다. 스티비(www.stibee.com)는 디자인솔루션 기업 슬로워크에서 운영하는 이메일마케팅 서비스입니다. 현재 무료 베타서비스 중이며, 모바일에 최적화된 반응형 이메일을 손쉽게 제작할 수 있습니다. 이메일마케팅 팁을 공유하는 뉴스레터를 꾸준히 발행하고 있으며, 패스트캠퍼스와 어벤저스쿨 등에서 이메일마케팅 강의를 해 오고 있습니다. 이메일마케팅의 효과를 극대화하고, 마케팅 실무자들의 업무 부담을 줄이는 것을 목표로 하고 있습니다. 이메일마케팅을 전문으로 다루는 컨퍼런스가 있습니다. 한국에서는 찾아볼 수 없지만 해외에는 이메일마케팅에 특..
반응형 웹, 정말 효과적일까? 제가 웹 개발을 시작하고 느낀 점 중의 하나가 세상에 이렇게 많은 모바일 기기가 있었나 하는 것인데요. 아무래도 사용자들이 휴대전화나 태블릿을 PC보다 많이 사용하다 보니 다양한 환경에서 웹페이지가 잘 돌아가는지 테스트하고 오류에 대응하는 일이 큰일이 되었습니다. 이때 빼놓을 수 없는 개념이 ‘반응형 웹(Responsive Web)’입니다. 해상도의 변화, 즉 화면 크기에 따라 레이아웃이 조절되는 웹페이지를 말합니다. 사용자의 입장에서는 어느 기기에서든 같은 콘텐츠를 적절한 화면으로 볼 수 있고, 개발자 입장에서는 기기마다 따로 웹페이지를 개발하지 않아도 되므로 비용을 절감할 수 있습니다. 이런 이유로 반응형 웹은 2010년 ‘A List Apart’라는 웹디자이너 매거진에 처음 소개된 이래로 큰 인기를..
어떤 웹 브라우저 쓰세요? 데스크탑, 노트북, 태블릿, 모바일 등 다양한 기기에서 하루 한두 번씩은 접속하는 인터넷을 이용할 수 있게 해주는 웹 브라우저. 대부분의 사람들이 웹 브라우저하면 마이크로소프트사(Microsoft)의 인터넷 익스플로러(이하 IE)를 떠올릴텐데요. IE를 중심으로 다양한 웹 브라우저를 살펴보고 제대로 된 웹서핑을 위한 팁을 살펴보도록 하겠습니다. 웹사이트가 깨져보이고 로딩이 느린 이유똑같은 웹사이트를 방문하더라도 어떤 웹 브라우저를 사용하느냐에 따라 보이는 화면과 속도가 달라질 수 있습니다. 보통 IE 구버전에서 발생하는 문제인데요. 그 이유를 알아보기 전에 전세계 웹 브라우저 점유율 변화를 살펴보시죠. 출처 : StatCounter 전세계 웹 브라우저 점유율 1995년에 마이크로소프트가 윈도우즈(Wind..
스케치(Sketch)와 어도비(Adobe) XD, 어떻게 다를까? 올 초 인터랙션 디자이너로 스티비에 합류하면서 어도비(Adobe)를 벗어나 다양한 프로토타이핑 툴을 사용했습니다. 그 중 가장 선호하는 툴은 스케치(Sketch)로, 새로 리뉴얼하는 스티비의 90% 이상을 스케치 기반으로 만들고 있습니다. 처음에는 왜 스케치를 쓰는 디자이너가 많아지는 걸까? 의문이 들었는데요. 스케치를 쓸수록 반복적인 업무가 효과적으로 단축되고 협업할 때 편리해서 제게도 다른 툴을 제치고 가장 많이 사용하는 툴로 자리잡았습니다. 지난해, 디자이너 툴 서베이 결과에 따르면 조사 대상자 중 스케치 사용자가 34%, 포토샵 사용자는 29%로 스케치 유저가 포토샵 사용자보다 많았습니다. 기존 유저 중 절반을 스케치에 빼앗겨버린 어도비가 안쓰러울 정도였는데요. 이렇게까지 유저들이 포토샵에서 스케..