본문 바로가기

디자인/공부 & 정보 공유

(22)
인간 중심 디자인에 관하여 예전의 저(불과 몇 달 전)는 좋은 인터페이스 디자인이 무엇인가?에 대해 사용자 경험을 고려한 인터페이스! 라고만 생각했습니다. 물론, 사용자 경험을 고려한 인터페이스가 좋은 디자인이 맞습니다. 그렇지만 사용자 경험이 구체적으로 무엇인지에 대해 깊게 생각해 본 적이 없다는 걸 문득 깨달았습니다. 사용자가 마냥 이용하기 편리하다고 해서 UX가 좋다고 할 수 있을까? 어떤 게 좋은 UX일까? 그 해답을 찾고 싶었고 UX 공부에 대한 필요성을 절실히 느끼던 중, '인간 중심 디자인'이라는 단어를 접했습니다. Human-Centered Design, 인간 중심 디자인 인간 중심 디자인의 정의는 다음과 같습니다. 1. 제품 사용자의 요구와 니즈, 동기, 정황을 이해하는 과정 2. 사업 측면과 기술 측면의 요구사항..
디자인시스템 모음집 계속해서 업데이트 됩니다 ! 📍 Apple, Google, Microsoft 등 해외 유명 기업의 디자인 시스템을 모아놓은 사이트 https://designsystems.surf/design-systems Design Systems Database of best-in-class Design Systems from top-tier tech companies and leading UI teams designsystems.surf 📍 SOCAR 디자인시스템 https://socarframe.socar.kr/8bb3aba4a/p/5857a5-socar-frame SOCAR FRAME · zeroheight socarframe.socar.kr 📍 Spotify 디자인시스템 https://spotify.design..
앱 크리틱 01 : 리클 디자이너에게 있어서 중요한 '생각하는 힘', 그 힘을 기르기 위해 앱 크리틱을 시작해보고자 한다. 앱 크리틱은 해외 기업 면접에서도 종종 진행된다. 그만큼 무언가를 분석하고 비평해 보는 것은 중요하다고 할 수 있다. "리클 (Recl)" 오늘 분석해 볼 앱은 "리클"이다. 이름에서 느껴지다시피 리사이클하는 앱인데, 정확히는 모바일 의류 수거 & 리셀 스토어 운영을 진행한다. 리클의 유저 개인적으로 생각하기에, 리클의 타겟 유저는 '주부'가 아닐까 싶다. 따라서 30-50대의 기혼 여성이 주 타켓층일 것이라 예상한다. 서비스 목적 옷을 버릴 때 의류 수거함까지 가는 게 귀찮고, 돈도 안 받고 버리자니 아까운 사람들이 분명 많을 것이다. (물론 나도 그렇다) 리클은 이런 귀찮음과 불편함을 한 번에 해결한다...
파워포인트(PPT)에서 사진 배경 제거 파워포인트로 자료를 제작할 때 사진 첨부는 거의 필수적이라고 할 수 있습니다. 근데 PPT에 사진을 넣다 보면 가끔 이런 생각이 들 때가 있습니다. 사진 누끼를 따면 더 깔끔하고 좋을 텐데..! 하지만 매번 포토샵에 가서 누끼를 따고, 그 사진을 다시 저장해서 첨부하는 건 꽤나 귀찮은 일이죠. 그런데 파워포인트(PPT)에서 '자동으로 배경 제거를 할 수 있다는 사실' 알고 계신가요? 파워포인트 ▷ 그림 서식 ▷ 배경 제거 순으로 들어가면 아주 손쉽게 배경을 제거할 수 있습니다. 아래 예시와 함께 더 자세히 포스팅해보도록 하겠습니다. 파워포인트에서 사진 배경 제거하는 법 1. 일단 파워포인트에 들어가서 배경을 제거하고자 하는 사진을 가져와 줍니다. 2. 사진을 클릭하고, 상단 메뉴 바에서 그림 서식 > 배..
어떤 디자이너가 될 것인가 (feat. 어도비 디자이너 김준) 유튜브 '디자인 소리' 채널에서 이라는 영상을 접하게 되었다. ▽ 바로 아래의 영상이다 ▽ 어도비 디자이너 김준, UX 디자인은 문제점을 찾고 푸는 것 어도비에서 일하고 있는 김준 디자이너는 UX를 가지고 이렇게 정의한다. 유저들의 문제점을 찾아내고 속 시원히 풀어내는 것 UX/UI 디자이너라면 유저가 원하는 경험을 제공할 수 있어야 한다. 그것이 곧 UX/UI 디자이너의 역할이기도 하다. 유저를 당황하게 만들고 헷갈리게 하는 디자인은 결코 좋은 디자인이 아니다. 또한 그런 디자인을 탄생시킨 디자이너는 좋은 디자이너가 아니다! 근데 지금 내가 그런 디자인을 탄생시킨 거 같다. (ㅠㅠ) 요즘 들어 인터페이스 디자인을 할 때 UX를 잘 고려했는가?라는 의문이 든다. UX를 생각하는 척만 하면서 단순히 화면 ..
NFT에 대해 알아보자 요즘 NFT라는 단어가 여기저기서 들린다. 인터넷 상으로 그림이나 영상을 사고 판다는 거 같긴 한데, 정확한 의미도 모르겠고~ NFT의 수익구조가 궁금하기도 했다. 그래서 이번 기회에 공부도 할 겸, 지식 공유도 할 겸, 글로 남겨보고자 한다! 블록체인으로 만든 인증서 = NFT NFT는 Non-fungible token의 약자로, '대체 불가능 토큰'을 의미한다. 대체 불가능 토큰이라는 건 1. 블록체인 기술을 이용하여 2. 그림, 영상 등의 디지털 파일을 가리키는 주소를 토큰 안에 담아서 3. 그 고유한 원본성과 소유권을 나타내는 것을 말한다. 즉 블록체인으로 만든 일종의 인증서가 바로 NFT라고 할 수 있다. NFT에는 고유 번호가 적혀있어 조작이 불가능하다는 특징이 있다. 나는 평소에 NFT에 관..
게임 UI 알아보기 [클래시 오브 클랜] 이번에 살펴볼 게임 UI는 '클래시 오브 클랜'이다. 피그마로 클래시 오브 클랜의 메인화면 UI 배치나 크기를 따라 만들어보면서 대략적인 가로모드 게임 UI에 대한 감을 잡아 보았다. 왼쪽은 나의 게임 메인 화면이고, 오른쪽은 피그마로 클오클의 아이콘 크기와 배치를 카피해 본 것이다. 메인화면에 들어가는 기능이 약 18개로, 굉장히 많지만 UI는 전혀 조잡하지 않고 정돈된 느낌이 있다. 아이콘 크기도 적당하고 여러모로 UI를 뜯어보기에 좋은 레퍼런스인 듯하다. 화면 높이 360px을 기준으로, 작은 아이콘 박스 크기는 33px로 동일하며 큰 박스는 62 or 64로 60 초반 값을 가진다 그리고 왜인지 모르겠는데 간격이 다 다르다 같은 크기의 아이콘이라도 어떤 곳은 간격이 6이고 어떤 건 9이다. -> ..
[UI/UX] 오늘의집 모작해보기 오늘의 모작: 오늘의집 [ 레이아웃 그리드 ] Count: 4 Type: Stretch Width: Auto Margin: 18 (양 옆으로 18px씩 여백) Gutter:20 (Gutter은 column사이 간격을 말함) 위처럼 레이아웃 그리드를 설정하면 아래 사진(왼쪽)과 같이 그리드가 적용된다. [ 오늘의집 모작을 통해 알게 된 점 ] - 검색창: Round 10 - 배너 광고: Round 10, 높이는 116 정도 - 영역 구분: 선이나 박스? 영역?으로 구분함. 근데 구분선을 보면 맨 위 구분선은 1px로 옅은 회색 가운데 구분 영역 16px로 아주 옅은 회색 내비게이션 바로 위에 구분선은 0.4px로 진한 회색이다. 진한 정도로 따지자면 맨 아래 내비게이션 구분선> 맨 위 구분선> 가운데 구분..