분류 전체보기 80

구글 머티리얼 디자인 3 번역 : 컴포넌트 - Badges

사실 뱃지는 그냥 건너뛸까 고민했다.모르는 사람도 없을 것 같고, 특이한 포인트랄게 있을까했다.그런데 머티리얼 디자인 가이드를 훑어보니 재밌는 포인트들이 있어서 안빼먹기로 결정했다. 번역 & 정리 시작한다.  사용법뱃지는 두가지다. 작은 뱃지, 큰 뱃지.점만 있는 뱃지가 작은 뱃지, 숫자도 함께 표현된 뱃지가 큰 뱃지다. Nav bar에 표시되었던 큰 뱃지는 해당 탭이 선택되었을때 작은 뱃지로 바꾸어 표현한다.   이건 하지 말아라뱃지는 아이콘의 우상단에 위치해있어야한다. (오른쪽에서 왼쪽으로 읽는 언어의 경우에만 좌상단)뱃지를 아이콘 위에 정확히 덮어버리거나, 우상단이 아닌 위치에 배치해서는 안된다.  또 통상적으로 유저들이 아는 뱃지 색상을 함부로 바꾸는 것도 금물이다. 정 바꾸고 싶다면 일관적인 색..

카테고리 없음 2025.03.15

구글 머티리얼 디자인 3 번역 : 컴포넌트 - Segmented buttons

음 이걸 뭐라고 한글로 번역해야할지 모르겠는데 어거지로 한글로 번역하는 것보다 원문 느낌을 살려야겠다.오늘은 세그먼트 버튼에 대해 다룬다. 개요세그먼트 버튼은 뎁스를 최소화하면서도유저가 뷰를 스위치하거나, 옵션을 바꿀 수 있게 돕는 버튼이다 세그먼트 버튼에는 두종류가 있다. 1. only 단일 선택2. 다중 선택 가능 어떻게 생겨먹었나세그먼트 버튼에는 아이콘(3)만 표시해도 되고, 텍스트(4)만 표시해도 된다.한가지 주의해야하는 점은 현재 선택된 버튼을 명확하게 보여주기 위해 선택되었다는 사실을 보여주는 아이콘(5)이 필수라는 것이다! 세그먼트 버튼에 아이콘만 있을때, 텍스트만 있을때, 그리고 아이콘과 텍스트 모두 있을때선택되었다는 표시는 아래와 같이 한다!  영상으로 보면 아래와 같다. 버튼의 종류를 ..

카테고리 없음 2025.03.08

구글 머티리얼 디자인 3 번역 : 컴포넌트 - Icon Buttons

개요오늘은 아이콘 버튼에 대해 알아본다.매주 하나씩 번역하다보니 진짜 버튼에도 별의별 종류가 다 있다.아이콘 버튼은 텍스트 없이 아이콘으로만 이뤄진 버튼이다. 이 친구도 종류가 여럿이다.   언제 & 어떻게 쓰나좀 컴팩트한 영역 내에 한개 혹은 여러 버튼을 욱여넣어야할 때 쓰면 좋다. 당연히 상대적으로 중요도가 떨어지는 버튼일거다. 아이콘 버튼에는 컨테이너가 있을 수도 있고 없을 수도 있다. 웬만하면 컨테이너 있는 아이콘은 배경이랑 구분이 필요할 때만 쓰도록하자.안그럼 CTA 버튼처럼 중요도가 높은 버튼이랑 헷갈리기 쉽다. 컨테이너가 있는 아이콘 버튼은 크게 세 종류라고 보면 된다.1. Filled (단색으로 꽉찬 버튼)2. Filled Tonal (살짝 톤다운 된 색으로 꽉찬 버튼)3. Outlined..

카테고리 없음 2025.03.02

구글 머티리얼 디자인 3 번역 : 컴포넌트 - Extended FAB

지난주에는 FAB 버튼에 대해 알아봤었다. 이번이랑 뭐가 다르냐고?이번엔 확장판이다. 오늘은 아이콘 + 텍스트 조합의 "확장형 FAB"에 대해 알아보는 시간이다. 이 친구들은 위아래로 스크롤 가능한 화면에만 쓴다는게 핵심이다.스크롤 가능하지 않은 화면에는 쓰면 안된다. Extended FAB 개론다시한번 말한다. 스크롤 가능하지 않은 화면에는 extended FAB 쓰면 안된다. 그럴땐 버튼 쓰는거다.버튼이랑 사실 똑같이 생긴거 아니냐고? 비슷하게 생겼는데 다르다. 그림자의 유무, 색깔, Radius 값, 아이콘 유무까지 다르다.유저들의 머릿속에서는 무의식 중에 버튼과 Extended FAB의 용도가 나뉘어서 규격화되고 있다. 그걸 뒤섞으면 안된다.  Extended FAB을 여러 선택지 중 하나 택할때..

카테고리 없음 2025.02.23

구글 머티리얼 디자인 3 번역 : 컴포넌트 - FAB (Floating Action Button)

FAB은 무엇이고 언제 쓰는가Floating Action Button 이하 FAB은 가장 중요한 액션을 보여줄때 쓴다.당연히 스크린의 그 어떠한 정보보다 앞에 표시되어 있어야 한다.가장 중요한 액션을 보여줄때만! 써야한다. 뱃지나 다른 컴포넌트를 FAB 앞에 배치해서는 안된다. FAB이 맨앞에 있어야한다.그리고 배경과 '명확히' 구분되는 색깔이어야만 한다.  아이콘도 명확한 걸 써야한다. 해석의 여지를 줘서는 안된다.만약 웹서비스에 FAB을 넣을 거라면 커서가 호버될 때 툴팁을 써서 명확성을 한스푼 더해주는 것도 좋다. FAB은 제일 중요한 액션만 담고 있어야한다고 앞에서 말했는데 이럼 안된다.여러가지 액션을 담아야할땐 FAB 말고 메뉴에 넣든가 해라. FAB의 종류와 구성FAB은 컨테이너와 아이콘으로 ..

카테고리 없음 2025.02.15

구글 머티리얼 디자인 3 번역 : 컴포넌트 - 버튼

UI/UX에는 국룰이 있다.바로 구글의 머티리얼 디자인과 애플의 디자인 가이드다. 구글 머티리얼 디자인 : https://m3.material.io/애플 디자인 가이드 : https://developer.apple.com/kr/design/우리가 알고 있는 많은 회사들의 디자인 시스템은 '모두' 구글과 애플이 마련해놓은 규칙을 바탕으로 한다. 하지만 구글과 애플 모두 영어로 작성되었기 때문에 가볍게 슥 훑어볼 수가 없는 것이 현실이다. 그래서 오늘부터 구글 머티리얼 디자인을 시작으로 이 두 디자인 바이블을 번역해보려 한다.  첫 시작은 구글 머티리얼 디자인의 컴포넌트 중에서도 가장 중요한 "버튼" 이다.  1. 버튼에 대한 개괄적인 이야기모든 컴포넌트는 존재하는 이유가 있기 마련.버튼은 유저가 원하는 행..

카테고리 없음 2025.02.09

독서는 중용을 찾아가는 과정

독서는 중용을 찾아가는 과정이다. 이 '중용'이라는 말의 뜻을 좀 더 이해하기 쉽도록 비유를 통해 설명해보고자 한다. 자, 우리의 생각은 그 작동 원리가 진자의 움직임과 똑같다. 독자는 책을 통해 저자의 이런저런 생각을 접한다. 그리고 개중에는 극단적인 주장을 펼치는 저자들도 있다. 하지만 인내심과 끈기를 갖고 한 권 내내 해당 저자의 말을 묵묵히 들어주다보면 그 저자가 왜 그런 식으로 주장했는지 조금은 이해가 되기 시작한다. (일단 종이책으로 출판되었다는 것은 저자의 주장이 완벽한 개소리는 아니란 증거다) 그리고 이때 바로 가만히 정지되어 있었던 우리의 생각 진자(C)가 왼쪽으로 높이(A) 올라간다. 독서 전에는 C 근처에서 아주 작은 폭으로 움찔거리기만 할 뿐이었던 우리의 생각이 독서를 통한 외부 충..

카테고리 없음 2023.02.02

책을 읽어야 하는 이유

"Read, Read, Read" 워렌버핏이 한 말이다. 계속 읽어야 발전이 있다. 진짜 끊임없이 읽어야한다. 인류 최고의 지성들이 액기스만 모아서 정리해놨는데 책을 안읽는다는건 진짜 너무나도 큰 손해다. 결정적으로 책을 읽는 사람들과의 격차가 말도 안되게 벌어진다. 지적인 발전에도 독서는 매우 효과적이지만, 난 인성함양에도 책만큼 좋은 것이 없다고 본다. 책을 읽는다는 것은 남의 의견을 듣겠다는 적극적인 행위다. 도중에 읽다가 덮고 다른 책을 읽는다고 해도 "일단 입닥치고 너의 의견을 들어보겠다"는 태도가 기저에 깔려있는거다. 책을 꾸준히 읽는 사람치고 오만한 사람이 없는 이유다.

카테고리 없음 2022.05.30

0519. 자기확신, 현명하게 손절하는 법, 스타트업은 노력의 영역

1. 팀원들은 리더의 자기확신에 감화된다. 그렇다면 스타트업의 대표는 무엇을 통해서 자기확신을 가질 수 있는 것일까? 대표가 어느날 밑도 끝도 없이 "우린 잘될거다"라는 말을 내뱉는다면 그건 자기확신이 아니라 효과없는 자기최면에 불과하다. 결국 자기확신은 대표가 스스로 생각을 얼마나 해보았는지, 고민을 얼마나 해보았는지에 달려 있다. 무수한 고민 끝에 날카롭게 다듬어진 인사이트에 리더 스스로 자신감을 갖는 순간 자기 확신은 자연스럽게 흘러넘친다. 그리고 그렇게 흘러넘친 자기 확신은 팀원들에게 영향을 미친다. 그러니까 내가 더 준비를 많이 하고, 내가 더 고민을 많이 해야한다. 그게 One Team을 만드는 제1원칙이다. 2. 너무 매몰차게 연을 끊지 말자. 지금은 죽을만큼 밉고 꼴보기 싫어도 시간이 지나..

카테고리 없음 2022.05.20

Paul Graham : Do things that don't scale (2)

There are two reasons founders resist going out and recruiting users individually. One is a combination of shyness and laziness. They'd rather sit at home writing code than go out and talk to a bunch of strangers and probably be rejected by most of them. But for a startup to succeed, at least one founder (usually the CEO) will have to spend a lot of time on sales and marketing. 창업자들이 직접 나가서 유저들을..

카테고리 없음 2022.02.06

Paul Graham : Do things that don't scale (1)

One of the most common types of advice we give at Y Combinator is to do things that don't scale. A lot of would-be founders believe that startups either take off or don't. You build something, make it available, and if you've made a better mousetrap, people beat a path to your door as promised. Or they don't, in which case the market must not exist. 저희가 Y 콤비네이터 투자사들에게 건네는 가장 빈번한 조언은 '규모가 크지 않은 사..

카테고리 없음 2022.02.05

나의 직관은 하늘의 태양만큼이나 객관적인 사실이다

1. 당신 자신을 자기 이외의 곳에서 찾지 말라. 2. 인간에게 벌어지는 일은 어떤 것이 되었든 너무 빠르거나 너무 이르지 않다. 3. 당신 자신의 생각을 믿는 것, 은밀한 마음속에서 당신이 진실이라고 생각하는 것이 모든 사람에게도 그대로 진실이 된다고 믿는 것, 이것이 천재의 행동이다. 당신의 머릿속에 숨은 확신을 밖으로 드러내면 보편적 의미를 획득한다. 4. 나의 직관은 하늘의 태양만큼이나 객관적인 사실이다. 5. 각 개인에게는 음유시인이나 현자들에게서 나오는 하늘을 가로지르는 불빛보다 자기 마음속에서 샘솟는 한 줄기 빛이 더 중요하다. 싸니까 믿으니까 인터파크도서 버락 오바마, 니체, 간디, 마이클 잭슨에게 영감을 준 책 에머슨의 대표 강연 「개혁하는 인간」 국내 최초 수록 니체가 말한 초인(超人)..

카테고리 없음 2022.02.01

제 몸을 던져 깨달아야 진짜 자기가 된다

1. 머리는 자기 것이지만 생각은 남의 것이니 문제지. 내 머리로 생각하면 전혀 다른 앵글이 나와. 2. 개미 부류는 땅만 보고 가면서 눈앞의 먹이를 주워먹는 현실적인 사람들이야. 거미 부류는 허공에 거미줄을 치고 재수 없는 놈이 걸려들기를 기다리지. 뜬구름 잡고 추상적인 이야기를 하는 학자들이 대표적이야. 마지막이 꿀벌이네. 꿀벌은 화분으로 꽃가루를 옮기고 스스로의 힘으로 꿀을 만들어. 개미와 거미는 있는 걸 gathering하지만, 벌은 화분을 transfer하는 거야. 그게 창조야. 3. 떠나기 전의 탕자와 돌아온 후의 탕자는 완전히 다른 사람이라네. 그렇게 제 몸을 던져 깨달아야, 잘났거나 못났거나 진짜 자기가 되는 거지. 알겠나? 인간은 자신의 자유의지로 수만 가지 희비극을 다 겪어야 만족하는 ..

카테고리 없음 2022.02.01

자존감이 높은 사람이 일도 잘하는 이유

자존감이 높은 사람은 여유로울 수 있다. 내가 본질이고, 나머지는 부차적인 것이니 외부의 상황이 아무리 어지러워도 흔들리지 않는다. 여유로운 사람은 주위 사람들에게 애정을 가질 수 있다. 항상 차분하게 주위를 둘러볼 수 있으니 끊임없이 사람들을 관찰하고, 그 이면에서 희노애락을 발견한다. 주위 사람들에게 애정을 가지는 사람은 공감할 수 있다. 타인의 희노애락 속에서 우리 모두는 인간이라는 점을 깨닫고, 결국 나와 공통점을 발견한다. 공감할 줄 아는 이는 타인의 문제에 진심으로 뛰어든다. 나의 문제와 타인의 문제 간 경계를 허물고, 도움을 요청한 이의 문제를 해결하기 위해 두 팔을 걷는다. 결국 조직의 문제를 내 문제처럼 여기고, 항상 최선을 다하는 이는 유능하다고 평가받는다.

카테고리 없음 2022.01.31

조언을 건네라

조언을 건네라. 남에게 조언을 건네면 우리의 생각은 더 선명해지고, 일종의 책임감도 배울 수 있다. 머릿속으로만 알고 있는 지식은 그리 선명하지 않다. 얼핏 떠올렸을때는 꽤 선명하다고 생각했을지 몰라도 차분히 생각해보면 굉장히 희뿌옇다. 선명하지 않기 때문에 금방 잊힌다. 또, 머릿속으로만 알고 있는 지식은 단순한 '아이디어'에 불과하다. 실생활에 적용된 적이 없기 때문에 마찬가지로 금방 잊히기 십상이다. 하지만 조언은 그렇지 않다. 그 과정을 살펴보자면 다음과 같다. 우선, 조언은 타인의 인생에 직간접적으로 관여하는 것이기 때문에 함부로 행해져서는 안된다. 따라서 생각은 여러 번 정제되어야만 하고, 조언을 듣는 사람 인생의 일부분은 최악의 경우 내가 책임져야만 한다는 마음가짐까지 갖춰야 한다. 그렇게 ..

카테고리 없음 2022.01.31

효과적으로 일하는 방법 by 피터 드러커

1. 오늘날 많은 이들은 지식 노동자로서 살아간다. 그들 중 대다수는 효율적으로 일하는 중일 뿐, 효과적으로 일하지는 못한다. 자고로 지식 노동자라면 효과적으로 일하는 방법, 효과적으로 사는 방법을 배워야만 한다. 2. 주어진 일을 적은 자원으로 어떻게 빨리 해 내느냐가 효율성(efficiency)이라면, 실제 성과에 직접 영향을 미치는 핵심적인 부분을 잘 해 내는 것이 효과성(effectiveness)이다. 불필요한 일을 효율적으로 해 내는 것은 어리석은 것이고 효과적이지 못한 것이다. 3. 효과성은 하나의 '습관'이라서 연습과 훈련을 통해 체화될 수 있는 역량이다. 다만, 철저한 습관화를 통해서 몸에 익혀야 하고 구구단처럼 조건반사적으로 이뤄질 정도로 지루한 연습이 뒷받침되어야만 한다. 4. 효과성의..

카테고리 없음 2022.01.29

Paul Graham : How to think yourself (5)

More generally your goal should be not to let anything into your head unexamined, and things don't always enter your head in the form of statements. Some of the most powerful influences are implicit. How do you even notice these? By standing back and watching how other people get their ideas. 당신이 목표로 삼아야하는 바를 좀 더 포괄적으로 말씀드려보자면, 어떠한 것도 여러분의 머릿속에 검증되지 않은 채 함부로 들어오지 못하게 하는 것입니다. 무작정 믿어야 하는 그런 종류의 지..

카테고리 없음 2022.01.28

Paul Graham : How to think yourself (4)

It also works to go in the other direction: as well as cultivating a small collection of independent-minded friends, to try to meet as many different types of people as you can. It will decrease the influence of your immediate peers if you have several other groups of peers. Plus if you're part of several different worlds, you can often import ideas from one to another. 이렇게 행동하는 건 예상치 못한 또 하나의 장..

카테고리 없음 2022.01.27

Paul Graham : How to think yourself (3)

Can you make yourself more independent-minded? I think so. This quality may be largely inborn, but there seem to be ways to magnify it, or at least not to suppress it. 후천적으로 독립적인 사고 역량을 기르는 게 가능할까요? 전 그렇다고 생각합니다. 물론 선천적으로 타고나는 게 크긴 하지만, 더 독립적으로 사고하도록 길러주는 것도 가능하고 최소한 억제하지 않는 건 확실히 가능합니다. One of the most effective techniques is one practiced unintentionally by most nerds: simply to be less aware ..

카테고리 없음 2022.01.17

알토스벤처스 : Focus on the Controllables (2)

Reducing complexity involves making decisions. If you choose to march down a certain path, it means you are cutting off your other options. In business and life, we always have to make decisions in environments of uncertainty. The need to choose can create fear, anxiety and paralysis. The choices can be tough. 복잡성을 줄인다는 말은 곧 무엇을 쳐낼지 말지 결정한다는 뜻이기도 합니다. 만약 여러분이 어떤 길을 걷기로 선택하는 것은 그 밖의 다른 옵션들을 쳐낸다는 ..

카테고리 없음 2022.01.14

알토스벤처스 : Focus on the Controllables (1)

I came across this great quote by a guy whose father ran a jewelery store during the Great Depression. He carried on to build Helzberg Diamonds into a big enough (and wonderful enough) business that Warren Buffet eventually wanted to buy it: 이 이야기는 대공황 당시 보석가게를 운영하던 아버지를 둔 한 청년으로부터 우연히 들은 이야기입니다. 그 청년의 아버지는 Helzberg Diamonds라는 이름의 가게를 번듯하게 성장시켜, 워렌 버핏으로부터 인수하고 싶은 마음이 들도록 만드는데 성공했습니다. “When growi..

카테고리 없음 2022.01.13

CES 2022에 다녀왔다

CES 2022에 다녀왔다. CES에 이미 참여해본 분들께서, 이 행사는 딱 아는만큼 보이는 쇼라고 말씀해주셨다. 그리고 실제로도 그러했다. 난 아쉽게도 시야가 넓지 못해 많은 것을 배우진 못했다. 하지만 정말 중요한 것 두가지는 확실히 배우고 돌아온 것 같다. 첫째로는, 나를 믿어야 한다. CES에 참여하기 전까지 나는 우물 안의 개구리일 것이라는 생각이 지배적이었다. 큰 행사에 참여하면 세계 곳곳의 고수들을 만날 수 있을 것이라고 믿었고, CES는 그런 고수들을 만나기에 아주 좋은 장일 것이라고 여겼다. 그러나 세계 각지에서 날아온 창업아이템들은 그저 그랬고, 거액을 투자받았다는 창업가들은 그리 날카롭지 않았다. 내가 별 고민없이 툭 던진 질문에도 어버버하는 모습이었고, 전혀 준비되지 않은 모습에 나..

카테고리 없음 2022.01.13