[GN#53] 1인 SaaS 스타트업 6개월 운영 회고

2020-07-06 ~ 2020-07-12 사이의 주요 뉴스들
SaaS를 혼자 만들고 운영하는 것은 굉장히 외롭고 고된 길입니다. 그래서 해외에는 이런 개발자들만 모여서 서로 얘기를 나누는 IndieHackers 같은 웹사이트가 있죠. 혼자 또는 소규모로 서비스를 개발하는 인디 해커들이 모이는 커뮤니티입니다. 여기서는 종종 소규모 서비스 운영에 대한 고충이나 회고들을 볼 수 있어서 많은 참고가 됩니다. 긱뉴스를 통해서도 이런 서비스 운영에 대한 회고는 가능하면 많이 전달해 드리려고 하는데요. 그래서, 이번 주의 메인 뉴스는 Content Security Policy SaaS를 혼자 만드는 Stuart Larsen이라는 사람의 6개월 운영 회고 글을 선정했습니다. "아무도 신경 쓰지 않아요" "지연된 보상" 같은 부분은 서비스를 운영하는 분들은 모두 공감하실 내용이라고 생각이 됩니다.

IT를 하는 사람이라면 누구나 그 이름을 알만한 Linus Torvalds님께서 "전 이제 코딩을 하지 않아요" 라는 말을 한 게 화제가 되었습니다. 오픈소스 서밋 키노트에서 대화하며 나온 말인데요. 코딩보다 메일 읽는 시간이 많고, 그 메일에 답변은 주로 "No" 라고 적는 게 대부분이라고 말 하면서 그 이유를 설명하는 내용은 개발자, 리더, 회사의 대표님들에게도 추천해 드리고 싶어요. 누군가의 생각, 아이디어, 작업에 대해서 No 라고 말하기는 정말 어려운 일이고, No 라고 말하기 위해서는 그 배경을 알아야 한다는 말에 깊이 공감합니다.

언제부턴가 구글 검색에서 이미지 검색 페이지는 점점 망가져 가는 것처럼 느꼈는데요. 바로 Pinterest가 그 주된 이유입니다. 어떤 걸 검색해도 다 핀터레스트 이미지가 상단에 나오게 되니, 클릭하고 클릭하고 하면서 여러 번을 헤매게 만들게 되는데요. 핀터레스트의 Growth Hack SEO 방식을 파헤친 글에서 내용을 보실 수 있습니다. 흔히들 Blackhat SEO 전략이라고 부르는 안 좋은 방식이긴 한데요. 반대로 웹 사이트 운영자분들 께서는 이를 통해서 SEO에 대해서 다시 생각해 볼 수도 있지 않나 생각합니다. 같이 묶어서 구글의 리치 검색 결과 테스트 사이트도 확인하셔서 내 사이트가 구글에 얼마나 친화적인지도 알아보세요.


✓ 사내에서 슬랙을 쓰신다면 뉴스채널에 GeekNews SlackBot 을 추가하여 편하게 새 글을 받아보시고, 멤버들에게도 공유해주세요.
✓ 주위분들께 https://news.hada.io/weekly 를 추천해 주세요.
✓ 스팸함에 들어가지 않게 news@hada.io 를 주소록에 추가해주세요.
Twitter , Facebook 에서도 긱뉴스를 받아 보실 수 있습니다.

매주 월요일 아침, 지난 일주일간의 GeekNews 중 엄선한 뉴스들을 이메일로 보내드립니다.


1인 SaaS 스타트업 6개월 운영 회고

Content Security Policy 도구 CSPer를 혼자 만드는 Stuart Larsen이라는 사람의 글

- 아무도 신경쓰지 않아요
ㅤ→ 사람들은 자신의 문제를 해결해 줄 도구를 원하지만, 만드는데 들어간 노력은 신경쓰지 않고, 어떻게 동작하는지도 관심없어요. 동작하기만 한다면 그들의 다른 문제에 신경을 쓸 수 있으니까요.
ㅤ→ 잘못 되었다는게 아니에요. 이렇다는 것만 기억해 두세요.
ㅤ→ 아무도 신경쓰지 않는 것의 장점도 있어요. 이관 작업하면서 2시간 서비스 다운되는걸 고민했지만, 아무도 신경쓰지 않았어요. 몇일 동안 다운되어 있어도 아무도 신경쓰지 않았을거라고 생각해요. 불행하게도 또는 운좋게도 저는 Reliability 에 초점을 뒀어요. (지금은 그게 약간 낭비였다고 깨달았지만)

- 무료 트라이얼은 조심하세요
ㅤ→ 무료 버전이 있으면 시도해보고 훌륭하면 업그레이드 할 것 같지만.. 실제로는 그리 많지 않아요
ㅤ→ 수많은 무료 사용자가 있어도 업그레이드 하지 않으면 비용만 나갈 뿐이에요
ㅤ→ 무료버전을 쉽고 사용하기 편하게 기능을 추가할수록 업그레이드 할 필요가 없어질 뿐이에요.

- SEO / Pipeline / 광고
ㅤ→ 지금은 분명해 보이지만, 시작할때는 이런 것들을 내재화 하지 못했어요.
ㅤ→ 사람들은 당신의 제품을 단순히 우연히 발견하지 않아요
ㅤ→ 처음에 제 제품(CSPer)를 발표했을때 부하가 많이 걸리지는 않을까 고민했어요. k8s 나 db 오토스케일링은 잘되나, 이슈를 트레이싱하고 모니터링할수 있는 모든 설정을 고민하고 추가했는데.. 실제로는 거의 아무도 오지 않았어요.
ㅤ→ SEO/Marketing 은 가장 중요합니다.

- 사람들은 Open Source 를 꽤 많이 좋아합니다.
ㅤ→ 전 비슷한 오픈소스를 5-6년전에 만든적이 있어요. 사람들이 놀랍게도 빨리 유료제품에 비교해서 오픈소스를 추천합니다.
ㅤ→ 지금 만든 제품이 그때의 오픈소스보다 훨씬 좋지만, 아직도 사람들은 그 오래된 동작하지도 않는 오픈소스의 링크를 공유합니다.
ㅤ→ "오픈 소스" 라는게 안정성을 뛰어넘는 것처럼 보이기도 해요.
ㅤ→ 오픈소스로 바꾸고 유료 플랜을 추가해 볼까 생각도 했지만 하진 않았어요.

- 추가로, 자신을 위해 일하는건 놀랍습니다.
ㅤ→ 일이 내 삶의 중심이고, 아침에 일어나 커피한잔 하고 12시간을 일하고 또 일하지만 계속 재미있어요.
ㅤ→ 모든 작업에 대해서 뭘 했는지를 다 아는 것은 프로젝트를 재미있고 훌륭하게 만듭니다.

- 지연된 보상
ㅤ→ 다소 심리적인 것이지만, 열심히 일하고 보상을 받는 느낌을 제거하는게 꽤 어렵습니다.
ㅤ→ 뭔가 큰 릴리즈를 했다고 즉시 새로운 고객이 생기는게 아니거든요.
ㅤ→ 영향을 알려면 꽤 오래 기다려야해요. 즉시 고객이 오지 않아요.
ㅤ→ 열심히 일하지만 아무것도 일어나지 않는 다는 것에 마음이 상할수 있어요. 그걸 분리하는게 저한테는 정신적인 장벽이었어요.

- 약간은 롤러코스터 같아요
ㅤ→ 일이 안좋아질 때는 많은일이 동시에 나빠지는 것 같아요. 고객이 떠나고, 파이어폭스 확장 스토어가 내 애드온을 삭제하고, 경쟁업체가 큰 투자를 받고..
ㅤ→ 정서적인 버퍼가 중요합니다. 내 공간에 약간의 여지를 둬서 이런 충격을 버티도록 했었던거 같아요.
ㅤ→ 영화/책/인터넷에서 모든 스타트업은 성공적이에요. 다들 성공하고 대가와 보상이 클것 같지만 실제로는 실패할 가능성이 가장 높습니다.

- 외로움
ㅤ→ 가장 큰 단점은 팀으로 일하지 않는 것입니다.
ㅤ→ 새 고객이 생기면 여자친구한테 Twinkie(크림 들어간 케이크형 미국과자 ) 하나를 받는 시스템을 만들었어요.

- 그외 좋았던 것
ㅤ→ Staging/Prod 서버 분리. Staging 때문에 여러번 구원받았어요. 큰 변경할때 스트레스도 적구요. 돈가치를 합니다.
ㅤ→ GKE 의 k8s는 꽤 좋았어요. 인프라 설정하는데 하루이틀이면 되었고 그 다음에 신경 안써도 되었어요. 알아서 스케일링됩니다.
ㅤ→ 단일 명령으로 배포 및 여러개의 Makefile들. 나중에 쓸모 있는 모든 명령은 Makefile 에 넣기. 자잘한거에 신경쓰기 싫어요.

- 실망스러운 것
ㅤ→ 브라우저 확장 리뷰 프로세스 : 크롬은 몇주 걸리고, Firefox 는 코드가 잘 컴파일 되고, 그게 실제 앱스토어에 있는것과 일치하는지 매우 까다롭게 확인합니다.
ㅤ→ SaaS 의 비용 청구 : 스타트업을 위해서 다른 서비스들을 많이 쓰는데, 정작 청구할 때 이메일 한통도 보내지 않는 서비스들이 있어요.
ㅤ→ 링크드인,구글,페이스북,트위터에 광고를 시도했지만 별로 좋지 않았어요. 내가 광고를 잘 못 했을수도 있지만, 그 광고를 멈춰도 신규가입이 줄지는 않았어요.
ㅤㅤ그 대신 저는 SEO에 더 집중하려고 합니다. 사람들이 문제가 생기면 보통 구글링을 하고, 그럴때 내 회사가 거기에 있으면 됩니다.

저한테도 해당되는 말들인 것 같아서 살짝 요약해 봤습니다.
위에서 아래 4가지가 가장 와닿는 것 같아요.
"아무도 신경쓰지 않아요"
"지연된 보상"
"SEO가 중요해요"
"Staging/Prod 서버 분리"

 
리누스 토발즈 - 전 이제 코딩을 하지 않아요

최근 오픈소스 서밋 키노트에서 한 대화를 옮김.
개발자에게 보내는 좋은 메시지 라고 생각합니다.

Q: 요즘 뭐하세요?
A: 메일을 읽어요. 메일을 쓰고, 이제 코딩은 하지 않아요
제가 작성하는 대부분의 코드는 메일리더 안에서 작성됩니다. 누가 나에게 패치나 PR을 보내면 그거에 반응해서 "아니오, 이건 괜찮지만.." 이라고 말하며 슈도코드를 보내고는 합니다. 패치를 컴파일해보지 않고, 테스트해보지 않고 말그대로 메일 리더에서 썼기 때문에 '내 생각에 이래야 할거 같아요' 라고 얘기하는게 내 일이에요. 난 이제 더 이상 프로그래머가 아닙니다.

난 주로 메일 작성보다 더 많은 메일을 읽기 때문에 결국 내 직업은 "No" 라고 말하는 것입니다.
누군가는 사람들에게 "No" 라고 거절 할 수 있어야 합니다.
다른 개발자들이 뭔가 일을 잘못하면 내가 "No"라고 할걸 알기 때문에 그들이 좀더 조심스러워지기를 희망합니다.
No 라고 얘기할 수 있으려면 그 배경을 알아야 합니다. 그렇지 않으면 내 일을 할수 없기 때문입니다. 그래서 저의 모든 시간을 사람들이 어떤 일을 하는지를 알기 위한 이메일을 읽는데 씁니다. 흥미로운 일이지만 대부분의 시간을 이메일을 읽는데 소비합니다.

개발자들에게 내가 희망하는건, 만드는 것이 좋은 코드 뿐만이 아니라 코드에 대한 좋은 설명도 작성했으면 합니다.
그래서 저에게 커밋메시지는 코드 변경 만큼이나 중요합니다.
때로는 코드 변경이 너무 분명해서 메시지가 필요없는 경우도 있긴 하지만 매우 매우 드뭅니다.
그래서 개발자가 생각해 줬으면 하는 것중 하나는 실제로 코드를 작성하는 사람들은 코드 자체만이 아니라 왜 그 코드가 어떤 일을 하고, 왜 그런 변경이 필요했는지를 설명하는 것입니다. 코드를 저에게 설명해 줄수 있다면 코드를 신뢰할수 있게 되기 때문입니다.

오픈소스의 대부분은 커뮤니케이션으로 이루어집니다. 그중의 일부는 커밋메시지고, 그중의 일부는 왔다갔다 하는 이메일입니다. 왜 당신이 그일을 하는가 또는 왜 그게 당신에게는 워킹하지 않는가를 설명하는 것은 정말 중요합니다.

누군가의 생각,아이디어,작업에 대해서 No 라고 말하기는 정말 어려운 일이에요.
No 라고 말하기 위해서는 그 배경을 알아야 한다는 말에 깊이 공감합니다.

 
Pinterest 의 구글 이미지 SEO Growth Hack 파헤치기

- 핀터레스트가 사용자가 Pin한 이미지에 대해 구글에 다시 그 이미지를 리버스 검색해서 메타데이터 정보를 모은 후 그 정보를 자신들의 사이트에 재 등록해서 그 사진의 원본이 자신인 것 처럼 위장한다는 주장
ㅤ→ 즉 상위 검색결과와 같은 내용을 가진 이미지가 되므로 이미지 검색에선 항상 가장 상위가 되는 것

- 이 주장이 흥미로운 점
ㅤ→ 구글이 보통 자신들의 사이트를 스크래핑 하는걸 좋아하지 않기 때문에 이렇게 많은 이미지에 대해 블록 안 당하고 하는 것이 신기함
ㅤ→ 이런 어두운 SEO전략(blackhat)들이 트위터등에 노출되면 구글은 보통 수동적으로 문제 사이트에 불이익을 가함으로써 조치를 취함
ㅤㅤ( 에전 Rap Genius 사례등에서 볼수 있듯이 )
ㅤ→ 핀터레스트는 상장회사 라서, 구글이 불이익을 준다면 주가에 영향을 줄 수 있음

- 콘텐트 연관도(Content Relevance)는 구글의 검색 순위를 결정 하는 요소. 구글이 이해하는 방식과 비슷하게 설명한다면 당연히 순위가 높아짐. 구글이 이걸 blackhat 으로 규정하고 반응 할까 ?

- Pinterest SEO Growth Hack 의 동작방식
ㅤ1. 사용자가 아무런 메타정보 없이 사진을 업로드
ㅤ2. 핀터레스트가 구글에서 그 이미지에 대해서 리버스 이미지 검색
ㅤ3. 그 이미지와 관련된 모든 텍스트들을 스크래핑
ㅤ4. 핀터레스트가 자신들의 페이지에 "What others are saying" 부분에 이 텍스트들을 표시
ㅤ5. 구글이 이 페이지를 읽어오게 되면 이 사진에 대해서 구글이 이미 이해하고 있는 내용들을 가지고 있으므로, 관련도가 유사하다고 판단 순위를 높게 올림
ㅤ6. 수백만개의 사진에 대해 반복

- 구글의 반응
ㅤ→ 담당팀에서 직접 답변은 없었지만 내부조사는 진행되고 있을 것.
ㅤ→ 아직 이게 유효한건 구글에게 이미지 검색에 대한 우선순위가 높지 않기 때문일 것.

** 콘텐트 연관도를 이용하여 검색 순위 높이는 방법 **
ㅤ→ 구글은 각 URL 및 콘텐츠에 대해서 특정 검색어나 키워드와 관련된 연관도를 조사하고 이를 순위에 반영한다는 것은 잘 알려진 사실
ㅤ→ 위처럼 특정 이미지에 대해 Google이 이미 알고 있는 여러 텍스트를 모은 포괄적인 페이지를 만들면 연관도가 높음
ㅤ→ 자신의 사이트에서 핀터레스트가 하는 것과 비슷한 일을 할 수 있는 방법은 TF-IDF(Term Frequency-Inverse Document Frequency) 라고 부르는 NLP 기법을 사용하는 것
ㅤ→ TF-IDF는 특정 단어나 구절이 해당 문서에 얼마나 중요한지 밝히는데 도움이 되는 텍스트 분석 기술
ㅤ→ 해당 이미지에 대해 상위 25개 정도의 URL을 가져와서 문서 전체에 TF-IDF 를 수행해서 주요 토픽을 분리 가능
ㅤ→ 이렇게 만든 문구들을 당신의 페이지에 넣으면 검색 순위가 올라갈 수도 있다는 주장

사실 핀터레스트가 저렇게 하는것 같다는 것도 하나의 주장일뿐이고, 이 사람의 글도 하나의 주장일뿐이긴 한데
구글 이미지 검색이 핀터레스트 때문에 굉장히 보기 힘들어진 것은 맞는 것 같습니다.

제가 피규어 도색때문에 다른 사람들의 페인팅 작례들을 많이 검색해보는데,
대부분 핀터레스트가 상위에 나오니까 클릭해서 핀터레스트 가서 다시 찾아가는게 일상이 되어버린지 한참 되었어요.
구글에서 "* 작례" 를 검색해보시면 최상위는 거의 다 핀터레스트가 차지하고 있습니다.
영문검색할때 "보드게임명 painting" 을 검색해봐도 핀터레스트가 최상위인게 많더군요

구글 검색에서 페널티 받은 브랜드들 모음
https://marketingland.com/10-big-brands-that-were-penalized-by-google-…

 
구글 리치 검색결과 테스트

- 웹페이지가 구글의 리치검색결과를 지원하는지 테스트 하는 도구
- 몇년간의 베타 종료하고 정식 공개
ㅤ→ 기존의 구조화 데이터 테스팅 도구는 지원 종료예정
- 테스트 해볼수 있는 구조화 데이터들
ㅤ→ 기사, 도서, 탐색경로, 캐러셀, 교육 과정, 비평가 리뷰, 데이터셋, 평점, 이벤트, FAQ, How-To, 채용정보, 지역 비즈니스, 로고, 영화, 예상 급여, 팟캐스트, 제품, Q&A 등

웹사이트 운영자라면 구글의 검색갤러리를 한번 둘러보고
자신의 사이트에서 제공되는 정보와 매칭되는게 있다면 이를 구현하고 이 리치검색결과 테스트 통해서 확인해보는 게 중요합니다.
https://developers.google.com/search/docs/guides/search-gallery

 
한눈에 보는 타입스크립트

기존에 프로그래밍 경험이 있는 사람이 TypeScript에 입문할 수 있게끔 안내하는 글입니다. (한국어) 특히 Java나 C#과 같은 정적 타입의 객체지향 언어 사용 경험이 있는 사람이 타입스크립트를 처음 배우려 할 때 딱 좋을 것 같군요.

 
Easy OCR - 한글 포함 40+개언어 지원하는 OCR 오픈소스

- 파이썬 오픈소스 : PyTorch, torchvision, scipy 등을 사용
- 이미지 또는 OpenCV 이미지 객체를 넘겨서 글자 인식
- 간단한 코드로 사용가능. 결과값은 위치,문자열,신뢰수준을 리스트로 리턴
import easyocr
reader = easyocr.Reader(['ko','en'])
reader.readtext('test.jpg')
- GPU가 있으면 자동 사용. CPU모드로 강제하는 것도 가능

 
IT 개발자와 일할 때 필요한 모든 개발지식 A to Z 자료 모음집

비개발자가 온라인 서비스 개발 프로젝트에 참여해야 할 때 기본적으로 알아야 할 개발 관련 개념이나 업무 프로세스 등에 관해 대략 7개 페이지로 나누어 정리한 Notion 페이지입니다. (한국어) 각 개념을 엄밀하게 정의하기보다는 개발 프로젝트의 전반적인 큰 그림을 비개발자가 비교적 수월하게 받아들일 수 있게 하는 데 초점이 맞춰져 있습니다.

 
마이크로소프트의 monorepo 관리도구

- 마이크로소프트가 만들었다.
- 마이크로소프트는 github의 주인이다.
- github은 npm의 주인이다.
- 그렇다면 이것은 de-facto?
- PNPM, NPM, and Yarn 모두 지원(pnpm과 함께 쓰면 제일 빠름)
- Phantom dependencies 없음 https://rushjs.io/pages/advanced/phantom_deps/
- NPM doppelgangers 없음 https://rushjs.io/pages/advanced/npm_doppelgangers/

적용해보고 후기 올리겠습니다.

 
Slack 의 2020-5-12 장애 보고

슬랙이 처음으로 꽤 오래 전체 다운되었던 이슈에 대한 설명

1. DB 구성변경 배포후 DB부하가 증가되는 퍼포먼스 버그가 발견되어서 몇분만에 롤백
2. 그럼에도 이 이슈로 웹앱 오토스케일링이 활성화 되면서, Hard Limit 보다 많은 수의 인스턴스가 증가
3. 이로 인해 로드밸런서 내에 호스트 리스트 업데이트 부분에 버그가 발생되면서 새로운 인스턴스들이 등록되지 못함
ㅤ→ HAProxy + Consul
4. 8시간이 지난뒤 호스트리스트에 남아있는 인스턴스들은 가장 오래된것들 뿐이었고, 스케일다운이 발생하자 오래된 인스턴스들이 셧다운
5. 새 인스턴스들이 이걸 넘겨받아야 했지만, 로드밸런서 호스트리스트에 새 인스턴스들이 없었음.

 
Readspike -해외 주요 IT 뉴스 사이트를 한눈에

BBC, Reddit, Hacker News, The Verge 등. 해외의 주요 IT / 일반 뉴스들의 인기글들을 한눈에 볼 수 있는 사이트입니다. 매일 하루 한번씩 보고 있는데, 얻어가는 정보가 많네요!

거의 비슷한 사이트로 https://skimfeed.com/ 도 있습니다.

한국어 버전으로 이런걸 만들어보려고 했는데, 몇개 안되서 고민중이에요..

 
프론트엔드 개발자 면접 문제은행

웹 프론트엔드 개발자 면접에서 나올 법한 각종 질문들에 대한 문제은행입니다. (영어, 한국어 등) Darcy Clarke라는 웹 개발자가 2009년부터 모으기 시작한 질문들을 2012년에 공개한 것이 시초로, 지금까지 100명에 가까운 사람이 기여하였지요. 이 문제은행에는 질문만 있고, 정답은 주어져 있지 않습니다. 회사 입장에서는 이를 프론트엔드 개발자 면접에 활용할 수 있겠고, 해당 분야 구직자 입장에서는 자신이 해당 분야를 얼마나 알고 있는지 점검하는 계기로 삼을 수 있겠습니다.

참고 - (불완전한) 한국어 번역:
https://h5bp.org/Front-end-Developer-Interview-Questions/translations/…

 
GitHub 에 개인 Profile 작성하기

- 자신의 GitHub 페이지를 개인 Profile 로 변경 하는법
- GitHub ID/ID 로 신규 Repo 를 만들고, Readme.md 에 자신의 프로필 내용을 적으면 끝
- 이미지 및 외부 링크 가능
- 아직 개발중이여서 전체에 열리지는 않았다고

모든 계정에 다 열린거 같지는 않은데, 되는 계정의 경우에는
새 Repo 생성시에 ID/ID 로 만들면 아래와 같은 문구가 보입니다.

You found a secret! xguru/xguru is a ✨special ✨ repository that you can use to add a README.md to your GitHub profile. Make sure it’s public and initialize it with a README to get started.

이렇게 만들어본 제 프로필 https://github.com/xguru

 
Cloudflare TV 처음부터 구축하기

- 24시간 온라인 스트리밍 하는 TV를 만든 기술 스택 이야기
- 기본적으로 Zoom → RTMP → Nginx + RTMP모듈 → Cloudflare 네트웍
ㅤ→ 쉽게 방송에 참가 할수 있도록 Zoom 을 활용
- BBC의 Live 비디오 오픈소스인 Brave 활용해서 여러 채널로 부터 가져오기
- 헤드리스 CMS 도구인 Contentful 로 콘텐츠 스케줄링
- Nginx + Brave + Contentful 연결은 클라우드플레어의 서버리스인 Workers 로

 
UI/UX 디자이너를 위한 47가지 교훈

알기 쉬운 예제를 통해서 제품개발,PM,엔지니어,QA 등 에게도 유용한 리스트

- 4 Rules of Thumb in UI Design
1. Pixel 대신 Density(PPI)를 위해 디자인 할 것
2. 8dp 단위 증분 사용
3. Color Weight를 이용한 계층구조 잡기
4. 느리게 만들지 말 것

- 5 Principles of Ethical UX Designs
5. 계속 알려줄 것
6. 부정적인 정보는 강조
7. 스팸은 그만
8. 개인 정보는 투명하게
9. 취소하기 쉽게

- 4 Ways to Spice Up a UI Design
10. 작은 문구에도 생명 불어넣기
11. 다크모드 추가
12. 에러 상태도 좋은 경험으로 만들기
13. 패턴과 그라디언트 사용

- 5 Commandments for UI Design
14. 빈 화면 꾸미기
15. 터치 인터페이스라면 타겟 크기를 넉넉히
16. 무한 스크롤은 피드 스타일 콘텐츠에만
17. 말로하지 말고 보여줄 것
18. 네이티브 컴포넌트를 사용할 것

- 5 Ways to Improve Dropdowns in UI & UX Design
19. 많이 선택하는 값들을 기본값으로
20. 단순화 할 것
21. 개인화
22. 시각적 요소 사용
23. 콤보보다 리스트박스

- 6 Soft Skills for UI & UX Designers
24. 건설적인 피드백 주고 명확히 원하는 부분에 피드백 받기
25. 적극적인 리스닝
26. 모든 커뮤니케이션 자체가 UX 프로젝트
27. Ego 버리기
28. Autodidacticism (자율주의)
29. 수용하기

- 4 Common Mistakes UI Designers Make
30. Scope를 무시하는 것
31. 사용자 컨텍스트를 간과하는 것
32. 동작보다 보이는거에 더 중점을 두는 것
33. 상태에 대한 디자인 누락

- 5 Insights from Apple's Human Interface Design Guidelines
34. 로그인/회원가입은 최대한 뒤로 미룰 것
35. 콘텐츠는 가능한 빨리 보일 것
36. 도움요청이 있을거라 예상할 것
37. 사용자들이 입력한 정보들을 잃어버리지 않도록 할 것
38. 알림메시지에 민감하거나 개인적, 비밀 정보들을 포함하지 말 것

- 6 Behavior Patterns for UX Design
39. 안전한 탐색 : 어디로 움직이든 현재상태로 돌아올 수 있도록
40. Instant Gratification : 즉각적으로 결과 보이기
41. Habituation : 모든 동작이 어디서든 똑같이 움직이도록 하기
42. 선택은 뒤로 미룰수 있게 하기
43. 반복은 간소화

- 4 Tips & Exercises to Develop Creativity
44. 평가하지 말기 : 창의성의 결쇠는 판단에서 자유로워 지는 것
45. 질 보다 양 : 창의성엔 더 많이 해보는게 도움이 된다.
46. 입력을 차단하기 : 부족할때 더 창의적이 된다.
47. 새로운 것을 시도하기

 
Rust 웹 프레임워크 선정하기 2020

actix-web, rocket, ride, warp 4개의 프레임워크를 비교
1. 기능 종합
ㅤactix,tide,warp : 슬림한 형태. Python Flask, JS Express 와 비슷
ㅤrocket : 다양한 기능 내장. Python Django, PHP Symphony 등과 비슷
2. 사용자
ㅤ다운로드 : actix(1250k) > rocket(525k) > warp(435k) > tide(47k)
3. Sync vs Async
ㅤactix, warp : 새버전 부터 async 적용
ㅤtide : 정식 전부터 nightly 통해서 async 지원
ㅤrocket : 아직 sync, 차후 버전에서 지원 예정
3.1 Futures 런타임
ㅤactix, rocket, warp : tokio
ㅤtide : async-std
4. 문서화, 튜토리얼 & 예제
ㅤactix-web , rocket 쪽 문서가 더 많지만 둘 다 이전 버전용 자료들이 많음

최종 선택은
ㅤ→ Production API 를 만든다면 actix-web
ㅤㅤ실제 프로덕션에서 가장 많이 쓰이고, tokio 를 사용하고, 성숙된 커뮤니티와 플러그인들

ㅤ→ tide 와 warp 는 async 를 최대한 활용중
ㅤ→ rocket 의 차기버전도 기대해 볼만

 
1년 간의 유튜브 트렌딩 비디오 분석 (US)

- 개인이 API로 매일 크롤링해서 정제한 데이터를 통해 분석
- 2019년 365일x매일200개 = 약 72,994 개중 중복 제거후 11,177개
- 트렌딩에 들어가기 위한 조회수 : 최저 5.3만, 90%가 270만 이하에서 들어 갔고, 평균은 138만, 중위값은 77만
- 30일간 트렌딩에 들어간 비디오가 총 6개 : BTS가 그중 2개
- 트렌딩 비디오중 6%의 제목은 모두 대문자, 50%는 전체 대문자를 사용하지 않음, 20%는 1단어만 대문자, 10%는 2단어
- 가장 많이 쓴 단어는 official,video,2019,vs,trailer 순
- 제목의 길이는 36~64글자 사이. 평균 51글자
- 가장 많은 트렌딩 비디오를 생산한 채널은 "Linus Tech Tips" 총 365개 - 2008년에 시작한 채널로 현재 5천개의 비디오
ㅤ두번째 채널은 요리 채널인 "Binging with Babish" - 영화,드라마,애니에 나온 음식들을 재현해보는게 주요 컨텐츠
- 카테고리 순위 엔터테인먼트(28%) > 음악(14%) > 스포츠 (10%) > 코미디 > 피플 & 블로그 > Howto > 영화&애니메이션
- 업로드한 요일 화(11986) > 목,수,월 > 일,금 > 토(7345)
- 업로드한 시간 : 피크는 오후 4시~6시(GMT)
- 트렌딩 비디오가 되는데 걸리는 시간 : 평균 5.6일. 95% 이상이 13일 내에 트렌딩 리스트에 등록

* 크롤링해서 정제한 데이터는 해당 페이지 하단에서 Gumroad 를 써서 판매중 ($19+ ~)

유튜브의 데이터를 크롤링해서 데이터셋으로 판다는 것이 재미나네요.
Gumroad 는 이런 용도로 가장 적절한 플랫폼인듯.

Gumroad 얘기는 긱뉴스에 가장 처음에 올렸던 글이기도 합니다.
1조 회사를 만들다 실패한 경험 이야기 - https://news.hada.io/topic?id=2

 
Apple Design Resources

- 애플이 제공하는 자신들의 모든 플랫폼별 디자인 리소스 모음
- San Francisco 시스템 폰트용 심볼 2400개
- iOS / macOS / watchOS / tvOS
ㅤ→ Sketch, Photoshop, XD 템플릿 등
- Parallax PreviEwer App 및 포토샵용 Exporter 플러그인
- 그외 Apple Watch Face, AirPlay, ARKit, CarPlay, Game Center, HealthKit, HomeKit, Sign in With Apple 용 디자인 자료들

 
Zettlr - 제텔카스텐을 위한 마크다운 편집기

- Zettelkasten (제텔카스텐, 메모상자) 기법에 적합
- 학생, 연구원, 언론인, 작가등 글을 써야 하는 모든 사람을 위한 글쓰기 도구
- 맥/윈/리눅스를 지원하는 FOSS 오픈소스 (Electron)
- Zotero / JabRef 등과 연동 지원
- 다크모드 지원
- Pandoc, LaTeX 등을 이용한 다양한 Export 기능 (문서 및 슬라이드)

* FOSS ( Free & Open Source Software )

Zettelkasten (제텔카스텐, 메모상자) 은 독일의 사회학자인 니클라스 루만 (Niklas Luhmann) 이 공무원 재직 시절부터 자신의 메모를 정리한 방법으로 뭔가를 배우고, 자신의 지식으로 만들어가는 워크플로우를 최적화 하는 메모 기법.

1. 종이 한장(A4용지, 인덱스카드 등)에 절반으로 선을 긋는다
2. 한면(왼쪽면)에 머리속에 떠오른 모든 것을 적는다.
3. 페이지당 문자+숫자로 붙은 번호를 적는다. 숫자+문자+숫자 등으로 어디든 끼워 넣을수 있게 하는게 포인트
ㅤ→ 11과 12사이에 11a, 11b 가 들어갈 수 있고. 11a 와 11b 사이에는 11a1, 11a2 이런식
4. 그리고 각 메모가 연관이 있다면 아까 선을 그은 반대쪽(오른면)에 연결된 메모 번호를 적는다.

즉, 메모를 적고 그걸 연결하는 아날로그적 방법으로, 현대의 위키와도 비슷하다고 보면 됩니다.

한글로는 잘 정리된 문서가 없어서 한장의 문서로 보려면 아래 링크를 추천
The Zettelkasten Method https://lesswrong.com/posts/NfdHG6oHBJ8Qxc26s/…

제텔카스텐을 가장 잘 디지털화 할 수 있는 도구중의 하나는 Roam 입니다.

내가 노트툴 Roam 을 사랑하는 이유와 사용법 https://news.hada.io/topic?id=1349
Foam - VS Code 기반 개인 지식 관리 도구 https://news.hada.io/topic?id=2356

 
OpenDP - Open Differential Privacy 플랫폼

- Microsoft 와 Havard 가 같이 만든 DP(차등 개인정보 보호) 툴킷
- 정부,산업 및 학술기관이 민감한 데이터를 안전하게 공유할 수 있도록 하여 과학적/공익 연구를 지원할 수 있는 것을 목표
- C,C++,Python,R 및 기타 언어들을 지원하는 네이티브 런타임
- 다양한 데이터 소스에 직접 접근 가능(Apache Spark/Presto, Postgres, SQL Server, Data Lakes, CSV 등)

Differential Privacy Library 비교 https://news.hada.io/topic?id=1729
- IBM/differential-privacy-library (Python)
- google/differential-privacy (C++)
- brubinstein/diffpriv (R)
여기선 3개의 라이브러리를 비교했는데, 새로운 도구가 출현했네요.

 
SQLPad - 웹기반 SQL 편집기 & 시각화 도구

- Postgres, MySQL, SQL Server, Presto, Snowflake, BigQuery, SQLite 및 ODBC를 통한 모든 접속 지원
- 도커로 셀프호스트 가능한 Node.js 웹앱 오픈소스
- 사용자 기반 접속 및 권한 관리 (Admin,Editor)
ㅤ→ Local / Google OAuth / OpenID / SAML/ LDAP
ㅤ→ 사내용 웹 쿼리툴로 활용 가능

 
ARM 프로세서의 즐거운 날들

1. 애플의 ARM 전환
2. Ampere의 128코어 서버용 ARM 칩 : 작년에 80코어, 지난주에 128코어 발표
3. 세계에서 가장 빠른 슈퍼컴퓨터 ARM CPU 15.8만개짜리가 등극 (Fujitsu의 48코어 ARM SOC 사용)

ARM이 모바일 시장은 이미 몇년전에 석권했지만, 다른 컴퓨터 산업 분야도 먹어치우려는 중
맥뿐만이 아니라 다른 ARM 기반 데스크탑/노트북도 보게 될 것
아마존은 이미 AWS용 자체 ARM 칩을 설계해서 사용중 (Graviton2)

인텔은 지난 몇년간 정말로 문제가 많았어서, 애플이 ARM으로 전환하는데 가장 큰 도움준게 CPU에 대한 문제점 리포트를 애플이 계속 해왔다는 거라고 하더군요. 인텔은 정말 어디로 가는지 모르겠..

AMD는 계속 CPU쪽에서 강력해 지고는 있는데, 아직 마켓셰어는 인텔한테 안되는지라 앞으로 몇년을 더 봐야 할거 같구요.

글에 없는데 NVidia 는 Tegra 칩셋으로 이미 ARM 시장에서 입지가 있습니다. 닌텐도 스위치 와 Shield 가 이걸 이용중이기도 하죠.

 
Uber Magic 2.0 - 픽업을 완벽하게

우버의 사용자 픽업 경험을 개선한 UI/UX 사례
- 2012년에 나왔던 Rider용 앱은 매우 편했지만, 2016년까지 회사가 성장하며 기능이 추가되고 문제가 많아지면서 재설계한 과정을 상세히 정리
- 우버의 초기 처럼 "버튼 누르면, 차를 탄다" 같은 마법을 다시 재현하는 것
- 목표
ㅤ1. 빠르고 누구나, 어디서나 쓰기 쉽게
ㅤ2. 사용자가 그들의 시간과 돈을 더 잘 제어할 수 있게
ㅤ3. 혁신적이고 더 깊이 참여할 수 있는 플랫폼

"사용자의 기대는 점점 변화해감. 우버가 삶에 필수요소가 되어갈수록 기대는 진화함."

우버를 해외 갈때마다 써보면 픽업UI가 계속 조금씩 변하는 게 체감이 되긴 했었는데요.
특정 도시 같은 경우 아무데나 픽업이 불가능하게 되어 있어서 근처의 픽업장소 추천이 뜨는게 나름 편했는데,
이런 고민들을 했었네요. 굉장히 상세하게 사례를 정리해 놔서 재미나게 봤습니다.

 
애플의 맥 하드웨어 변경 예상

Jason Snell*의 정리

애플이 iOS의 기능들을 맥으로 가져오기 위해 노력했지만, 인텔 아키텍처에 의해 제한 되었었으나 애플칩이 그걸 해줄해 줄 것
차세대 맥에 추가될 아이폰/아이패드의 기능들 예상
- 둥근 화면 모서리 : 맥 오리지널 디스플레이는 둥근 모서리였음. 아이폰도 아이패드도. 맥도 당연히?
- 터치스크린 : 애플은 터치스크린 맥을 만드는걸 계속 거부했지만 시대가 바뀌었음. 아이패드의 보조로 키보드/마우스/애플펜슬이 나온 것처럼, 맥이 터치도 다룰수 있게 될 것
- Face ID : 왜 아직 맥에 Face ID가 도입 안되고 있는지 모르겠음. 윈도우즈도 Hello 로 이미 하고 있는데.. 더 좋은 웹캡과 함께 맥으로 가져와야 할 것
- Apple Pencil : 터치를 넣을거면 애플 펜슬도
- 새로운 인체공학적인 데스크탑 : iPad Pro Magic Keyboard 처럼 뭔가 새로운 것. 아니면 아예 테이블처럼 깔고 터치와 펜슬 입력이 가능한 것도 가능하지 않을까 ?
- 새로운 인체공학적인 랩탑 : 투인원 맥북은 어떨까
- ProMotion : 아이패드의 120Hz 주사율은 정말 훌륭. 맥에도 적용 가능 할거고, 애플펜슬과 함께라면 더더욱
- 셀룰러 모뎀 : 아직도 맥북에는 모뎀이 없음. 아이패드는 거의 초기부터 가능했는데.. 끝내는 나올것이라고 봄. 아마도 애플이 직접 5G 모뎀을 만들기 시작한 이후에

이런 일들이 올해 또는 내년에 일어나지는 않을 것.
하지만 대기하고 있던 다른 제품의 수많은 기능들을 가져오게 될 것.
Big Sur 는 소프트웨어가 어떻게 변해 갈지에 대한 단서를 주었고, 하드웨어 역시 그렇게 될 것

* 애플 관련 유명 작가이자 팟캐스터인 제이슨 스넬(Jason Snell) 은 맥월드 편집장 이었고, 지금은 애플 제품과 관련 기술을 얘기하는 Six Colors 를 만들어서 운영중. 팝 컬쳐 및 게임쇼를 관련 팟캐스트 네트웍인 The Incomparable 도 운영중

macOS Catalina 와 Big Sur 의 UI 변경점 비교 https://news.hada.io/topic?id=2383

 
Pinboard is Eleven

11년째 북마킹 서비스 Pinboard를 혼자 개발해온 maciej 의 회고.
년간 신규 북마크 2.4억개, AU 1.9만명, 년 2.5억의 매출. 투자는 0원
올해는 PHP와 MySQL을 최신버전으로 업그레이드 및 신규 API 개발

I Can't Stop Winning! https://news.hada.io/topic?id=27
10주년에 적은 글도 공유한 적 있는데 벌써 1년이 되었군요.

긱뉴스 1주년 회고도 적어보려고 합니다 ;)

 
전세계 Podcast 통계

2020년 7월 현재. 공개된 RSS 기반 팟캐스트를 수집해서 낸 통계
- 약 136만개의 팟캐스트. 7400만개의 에피소드
- 년간 신규 팟캐스트 : 2020(39.8만) 2019(29.5만) 2018(18.8만) 2017(12.3만)
ㅤ→ 매년 빠르게 증가하는 중
- 년간 종료되는 팟캐스트 : 2017~2019 매년 약 3.7만개 수준
- 영어>>>>>스페인어>포르투갈어>인도네시아어>독일어>프랑스어>중국어
- 장르 : 사회&문화 > 교육 > 종료 > 비즈니스 > 예술 > 코미디 > 음악 > 헬스 & 피트니스 > 스포츠 > 뉴스 > 레져 > TV&영화 > 기술 > 과학 > 어린이&가족
- 팟캐스트 RSS 호스팅 도메인 : anchor.fm (51만개, 38%) > soundcloud.com (10만개, 8.1%) > libsyn.com (7만개, 5.2%) > podbean.com (6만개, 4.4%)
ㅤ→ 애플은 2.2만개 수준으로 전체의 1.6% 밖에 안됨
- 개인 도메인으로 팟캐스트 RSS 를 호스팅하는 갯수 : 7.7만개

* 이 Listen Notes 는 팟캐스트 검색엔진으로, 이렇게 수집한 데이터셋은 API로 접근하거나 DB 자체로 구입도 가능