김효진

흘러가는 '시간'을 서비스로 만든다는 것: TMF(上)

김효진 — Thu, 01 Aug 2024 03:09:31 GMT

안녕하세요. ‘CAPED BOYZ’ 팀에서 Product Design을 담당하고 있는 김효진입니다. 저희 팀은 이번에 생산성을 높여주는 SaaS 플랫폼 'TMF(Time Mother Fxxker)(Time Management Framework)'의 MVP 버전을 출시하였습니다. 글은 상, 하편으로 나눠 발행합니다. ‘상’에서는 GTD(Getting Thi

내가 성장하고 있음을 - 3년 차 프로덕트 디자이너의 회고

김효진 — Sat, 31 Dec 2022 04:28:32 GMT

이직한 지 1년, 올해는 서비스 출시로 정말 바쁜 나날들을 보냈다. 이전에도 두 번의 서비스 출시 경험이 있었지만, 이직 후 경험한 이번 출시 과정은 나의 부족한 부분을 수면 위로 떠오르게 하였다. 그도 그럴 것이 이전 직장에서는 관공서와 연계된 수동적인 프로젝트에 참여하였지만, 현 직장에서는 실제 사용자를 대상으로 자발적인 아이데이션을 이끌어 내야 하는

이직을 위한 조용하지만 치밀한 작전 - 2년 차 프로덕트 디자이너

김효진 — Sun, 20 Mar 2022 17:34:34 GMT

어떤 직군에 종사하건, 이직은 조심스럽기만 하다. 퇴사 후 바로 이직에 성공한다면 너무 좋겠지만, 계획했던 기간보다 길어질 수도 있고, 생각지 못한 변수를 만날 수 있기에 퇴사를 하기 전 구체적인 계획은 필수라고 생각한다.(어쩌면... 구체적인 계획이 필수라고 한 것은 나의 성격 탓일 수 있다. 퇴사 후 계획을 세울 수도 있지만 성격상 잘되지 않는다. 하지

UI 디자인에서 이상적인 그림자를 만드는 방법

김효진 — Tue, 28 Sep 2021 18:02:47 GMT

현대 UI 디자인에서 그림자는 모든 곳에 자리하고 있다. fill, stroke 그리고 corner radius의 뒤를 잇는 UI 요소의 중요 부분 중 하나이다. 완전한 플랫 디자인(flat design)은 더 이상 트렌드가 아니다. 간단한 튜토리얼을 통해 카드, 버튼 또는 원하는 UI 컨트롤에 멋진 그림자를 만드는 방법에 대해 알아볼 것이다. 1.

Leading-Trim: 디지털 타입 세팅의 미래

김효진 — Thu, 29 Jul 2021 17:08:58 GMT

새로운 CSS 표준이 오래된 문제를 해결하고, 웹 앱의 기준을 높이는 방법 *조판(Typesetting) : 조판은 디지털 시스템에서 기호, 문자 및 상형 문자와 같은 개별 유형을 사용하여 텍스트를 배치하는 행위이다. 최적의 읽기 경험을 만들기 위해 단어를 배열하는 것이다. 문자만 가지고 조판이라고 부르기도 한다. 본론으로 들어가기에 앞서, 현재 Lea

텍스트 필드 & 폼 디자인 - Text fields & Forms design

김효진 — Sun, 18 Jul 2021 19:17:04 GMT

Container (Text fields & Forms design - UI component) 01. Container - 컨테이너 1. 다른 컴포넌트를 포함할 수 있는 GUI 컴포넌트 2. 추상 클래스로서 다른 컴포넌트를 포함할 수 있는 기능을 가진 컴포넌트들의 상위 클래스 3. 최상위 컨테이너는 다른 컨테이너에 속하지 않고 독립적으로 존재 가능한

모바일투썸이 '투썸하트'로 새롭게 업데이트되었다. - 투썸하트 UIUX 분석하기

김효진 — Mon, 28 Jun 2021 05:13:33 GMT

투썸플레이스를 방문하였다가 "지금, 투썸하트 앱을 다운로드하세요"라는 팜플랫을 받았다. 투썸하트? 원래 앱 이름이 투썸하트였나, 오랜만에 앱 스토어에서 투썸을 검색하게 되었다. 사실, 회사 근처에 제일 가까운 카페가 투썸이었기 때문에 아침에 투썸오더를 통해 커피를 미리 주문해 놓으려고 몇 번을 시도하였지만, 투썸오더가 지원되지 않는 매장이었고(투썸오더라는

동기, 비동기, 블로킹, 논블로킹 - 디자이너가 개발자와 일 하다 보니 (6)

김효진 — Tue, 15 Jun 2021 08:58:05 GMT

실무에서 개발자와 협업 시 개발에 대한 전문적인 지식을 가지고 있는 것이 아니기 때문에 개발자분들이 최대한 쉽게 설명해주지만, 많이 언급되는 부분에 대해서는 정리해두고, 추후 동일한 내용이 등장한다면 더 심도 있는 대화를 하려고 노력한다. 이 글은 개발자가 읽어보기에는 다소 기초적인 내용일 수 있지만, 디자이너의 입장에서는 충분히 도움될만한 내용이라고 생각

신규 서비스 출시(#5)_UI 디자인 시스템 공유 - 스타트업 앱 출시 과정을 기록하다.

김효진 — Mon, 31 May 2021 10:20:14 GMT

안녕하세요. 글쓴이 김효진입니다. 공지사항이 있어 이렇게 글을 남기게 되었습니다. 먼저 저의 `신규 서비스 출시의 처음과 끝`이라는 매거진을 긍정적으로 검토해주시고, 시간이 지난 시점에서도 관심 가져주시는 모든 분께 감사하다는 말씀을 전하고 싶습니다. 본론으로 돌아와, 기존 서비스의 리뉴얼이 결정됨에 따라 앱과 서비스 관련 자료들이 모두 내려가게 되었습

네이티브 앱 / 웹앱 / 크로스플랫폼앱 / 하이브리 앱 - 디자이너가 개발자와 일 하다 보니 (5)

김효진 — Wed, 21 Apr 2021 08:03:25 GMT

노마드 코더 Nomad Coders 개발과 디자인을 동시에 진행하고 있지 않은 디자이너라도 성공적인 앱 출시를 목표로 팀원 전체(디자이너, 개발자, 마케터, PM 등)가 참여하고 있기 때문에 네이티브 앱, 웹 앱, 크로스 플랫폼 앱, 하이브리드 앱이 어떤 것인지 정도는 알고 있으면 좋을 것 같아 정리하게 되었다. 개발자가 정리한 것처럼 심도 있는 정리가 아

신규 서비스 출시(#1)_디지털 프로덕트 제작 프로세스 - 스타트업 앱 출시 과정을 기록하다.

김효진 — Mon, 19 Apr 2021 17:13:24 GMT

UX : 무한 스크롤과 페이징 - UX : Infinite Scrolling vs. Pagination

김효진 — Sun, 04 Apr 2021 14:44:42 GMT

"표시할 콘텐츠가 많은데 내 콘텐츠에는 무한 스크롤? 페이징? 어떤 것을 사용하면 좋을까?" 일부 디자이너는 자신의 프로젝트에 어떤 방법을 선택해야 할지 확신하지 못한다. 이 글을 통해 두 가지 방법의 장, 단점을 간략하게 살펴보고 프로젝트에 맞게 적용시키면 좋을 것 같다. 무한 스크롤 (Infinite Scrolling) 무한 스크롤은 사용자

컨테이너 (버튼 디자인 - UI component)

김효진 — Sat, 27 Mar 2021 08:17:07 GMT

01. Container - 컨테이너 1. 다른 컴포넌트를 포함할 수 있는 GUI 컴포넌트 2. 추상 클래스로서 다른 컴포넌트를 포함할 수 있는 기능을 가진 컴포넌트들의 상위 클래스 3. 최상위 컨테이너는 다른 컨테이너에 속하지 않고 독립적으로 존재 가능한 컨테이너로 모든 컴포넌트는 컨테이너에 포함되어야 출력이 가능하다. 4. 컨테이너는 자신의 영역 내부

인터랙션 디자인은 UX 디자인의 일부이다.

김효진 — Sun, 14 Feb 2021 12:13:46 GMT

01. 사용자 경험 User Experience - UX 사용자 경험(UX)이라는 용어는 인터랙션과는 다르게 제품을 사용할 때 사람들이 마주하는 다양한 경험을 설명하는 데 사용된다. 사용자 경험을 좁은 의미에서 설명할 때는 보통 사용자가 제품을 직접 사용하면서 느끼는 경험을 의미한다. 좁은 의미의 사용자 경험은 다양한 사용자 인터페이스를 사용하는 경험과

페이스북과 쿠키 - 디자이너가 개발자와 일 하다 보니 (4)

김효진 — Sun, 10 Jan 2021 08:15:54 GMT

"Nomad Coders - 페이스북과 쿠키의 상관관계? Cookie 기초개념 잡아드림." 강의를 바탕으로 정리하였다. '유저의 정보를 저장해두었다가 요청이 들어오면 저장된 정보를 내보낸다.'라는 개념은 알고 있었지만 어디에 저장이 되고 어떠한 원리인지 깊게 알지 못하였다. 마침 좋은 강의가 있어 정리해보려고 한다. 01. HTTP 쿠키 #웹 쿠키,

디자이너가 데이터 활용하기 - 구글 애즈, 구글 애널리틱스, 책 추천

김효진 — Sat, 26 Dec 2020 07:16:24 GMT

디자이너가 데이터 활용하기 디자이너가 데이터 분석 능력이 필요한 이유 데이터 분석 목표 (중국 타깃) 구글 애즈 구글 애널리틱스 중국향 광고 주요 지표 및 용어 'Data-Driven UX' 책 추천 디자이너가 데이터 활용하기는 현재 협업하고 있는 마케터의 코멘트와 책(Data-Driven UX)을 기반으로 정리하였다. 01 디자이너가 데

API 기초 이해하기 - 디자이너가 개발자와 일 하다 보니 (3)

김효진 — Wed, 16 Dec 2020 04:47:48 GMT

01. API 란 # Application Programming Interface API는 키보드와 유사하다고 할 수 있다. 키보드를 통해 우린 컴퓨터와 대화한다. 키보드의 버튼을 누르면 -> 키보드에서 컴퓨터로 전달되고 -> 스크린에서 텍스트를 볼 수 있다. 키보드를 통해서 컴퓨터와 인터랙션(interaction : 상호작용) 하는 것이다. 이와 같

HTTP와 HTTPS 차이점 - 디자이너가 개발자와 일 하다 보니 (2)

김효진 — Thu, 10 Dec 2020 04:01:25 GMT

지난 2014년 구글에서는 HTTP를 HTTPS로 바꾸라고 권고한다. 그전까지는 전자상거래가 있는 웹 사이트에서만 다소 번거로운 HTTPS를 사용하고 있었다. HTTPS로 전환을 장려하기 위해서 구글에서는 HTTPS를 사용하는 웹 사이트에 대해서 검색 순위 결과에 약간의 가산점을 주겠다고 발표했다. 이는 사실상 HTTP를 사용하는 웹 사이트에게 벌점을 주는

UI cheat sheet: selectors - Radio Buttons, Checkboxes, Toggles 은 다르다

김효진 — Tue, 08 Dec 2020 09:46:40 GMT

최근에는 많은 앱과 웹 사이트에서 라디오 버튼, 체크 박스, 토글이 거의 같은 의미로 사용되는 것을 알아 차 렸다. 라디오 버튼은 체크 박스가 아니며 체크 박스는 토글이 아니고 토글은 라디오 버튼이 아니다. 이러한 각 요소는 고유 한 용도로 사용된다. 01 Radio Buttons (라디오 버튼) 라디오 버튼은 사용자가 항목 목록에서 하나의 옵션만

Atomic Design - Feat. Component(컴포넌트)

김효진 — Tue, 01 Dec 2020 14:19:54 GMT

※본 글은 'bradfrost'에서 발행한 글을 토대로 정리하였다. We’re not designing pages, we’re designing systems of components.—Stephen Hay 우리는 페이지를 디자인하는 것이 아니라 컴포넌트 시스템을 디자인하고 있습니다. 디자인을 하다 보면 개발자와 의사소통 속에서 'Component'를