인포그래픽 :: infographic 인포그래픽 정보의 양이 급속도로 증가함에 따라 비주얼 콘텐츠의 중요성이 강조되는 이 시점에서 사물에 대한 본질을 바라보는 통찰력이 중요시되고 있다. 그런데 텍스트로만 빼곡히 채워져 있는 정보가 있다면 누가 읽으려고나 할까? 그래서 정리해 봤다. 인포그래픽의 정의 1. 복잡한 데이터나 많은양의 정보를 단순화 시키는것. 2. 라인, 도형, 그래프, 다이어그램등으로 정보를 간소화하고 직관적으로 전달하는것. 인포그래픽의 종류 1. 통계형 인포그래픽 2. 지도형 인포글래픽 3. 대칭, 비교형 인포그래픽. 4. 프로세스형 인포그래픽. 적용사례 1. 웹사이트 2. 어플리케이션 3. SNS 및 기타 영상 매체 앞으로 갈수록 시각적인 의존도가 높아지게 될텐데 인포그래픽은 다양한 매체에서 제각기 다양한 영향력을 행사할것이.. 2020. 10. 23. 조너선 아이브 :: Jony Ive 조너선 아이브 누구나 좋아하는 디자이너 한명 쯤은 있을 것이다. 그중 가장 유명한 인물 중 하나를 뽑으라면 조니 아이브가 아닐까? 그의 최근 동향 및 요약을 통해 그가 어떤 사람인지 알아보고 그 주변에 어떠한 디자이너가 있었는지 확인해보자. 조너선 아이브 요약 1967년 교사인 아버지 밑에서 자람. 1989년 조니 아이브는 디자인 스튜디오 탠저린의 초창기 멤버였다. 하지만 하청디자인에 실망을 안게되어 퇴사를 결심한다. 1992년 애플에 입사 후 약 5년동안 애플에 있었다. 잡스를 만나게되어 전성기를 맞이한다. 최근동향 2019년 애플을 퇴사하고 마크뉴슨(Marc Newson)과 러브프롬(LoveFrom)이라는 디자인회사를 차리게 된다. 2020.10월 현재 에어비엔비의 고문디자이너로 사내 디자인팀과 협업.. 2020. 9. 21. 2020 디자인트렌드 :: 2020 design trend 2020 디자인트랜드의 고찰 트렌드가 빠르다고 UX에 꼭 도움이 되는것은 아니다. 트렌디한 디자인을 따라가다가 잘못된 사용성으로 서비스의 질에 누를 끼칠 수 있다는 말이다. 드리블과 인스타에서 주목받고 있는 최근트렌드를 살펴보고 그 트렌드의 문제점도 함께 생각해보자. 아 잠깐. 디자인트랜드를 이야기하기전에 기본적인 디자인 트렌드에는 어떠한것들이 있는지 살펴보고 가자. 기본 트렌드 1. 스큐어모픽 사물의 모습을 그대로 표현하는 디자인. 2. 플랫디자인 단순한 구성과 색상을 통해 직관적으로 인식할 수 있는 디자인. 3. 머티어리얼 디자인 구글이 개발한 시각언어로 그리드 기반의 레이아웃과 규칙적인 색상설계, 의도적으로 여백을 디자인. 새로운 트렌드의 문제점 1.뉴모피즘 (체험하기) 스큐어모피즘에서 탄생한 뉴모.. 2020. 9. 5. 해더 디자인 :: header design 해더 디자인 특징 1. 비주얼 디자인은 웹사이트에서 중요한 역할을 하며 전체적인 사이트의 분위기를 주도한다. 2. 시각적으로 자극적인 것들이 많고 미니멀리즘이 조금씩 밀려나고 있는 상황에 비주얼디자인의 중요성이 더 커지는 추세라고 볼 수 있다. 3. 디자이너가 몇달에 걸쳐 만들 프로젝트들도 짧게는 17초, 길게봐서 50초 만에 평가가 된다. 해더디자인 = 웹 비주얼 디자인 웹사이트 비주얼 디자인을 헤더디자인 으로 명명하기도 한다. 예전에 헤더는 GNB를 의미해 로고, 주요메뉴, SNS등이었지만 최근에는 비주얼을 포함하는 추세이다. 주요구성 - 로고 - 네비게이션 (메뉴) - 텍스트 헤드라인 - CTA 버튼: 행동을 유도하는 주요버튼 - 검색 등 비주얼 이미지의 크기 (header size) 정확한 픽셀보.. 2020. 9. 2. 사람-컴퓨터-상호작용 :: HCI HCI 정의 : (human computer interface. ) 사람과 컴퓨터(혹은 디지털 시스템) 사이의 상호작용에 대해연구하고 설계하는 분야를 가리킨다. 범위 : UI / UX / Interaction HCI의 3요소 1. 유용성(Usefulness) : 사용자에게 유용한 콘텐츠 혹은 기능. 2. 사용성(Usability) : UI / UX 3. 감성(Affect) : 디자인 혹은 인터랙션적인 측면 유용성 (심성모형 중 가치모형) 1. 기능적 가치 서비스의 본질적인 가치. 사용자가 방문하는 이유. 가장 본질적인 욕구를 충족시켜주는 가치. 2. 조건적 가치 사용자가 꼭 필요한 장소와 시간에 원하는 서비스를 사용하고자 하는 욕구를 충족시켜주는 가치. Ex) 위치서비스 기능, 비행기에 탑재된 낙하산. .. 2020. 8. 31. 황금 비율 :: . golden ratio 황금 비율 정의 : 고대 그리스에서 발견된 것으로 기하학적으로 가장 조화가 잡힌 비율로서 미적 감각이 뛰어나 붙여진 이름 특징 1. 황금비율은 시각적 안정감을 준다. 2, 조형적 아름다움을 위해서는 변형이 필요하다. (다양한 그리스 시스템 이해필요) 예시) 웹 디자인에 적용을 하면 폰트크기 13일때 라인하이트 값은 17이나 21이 좋다. 왜냐하면 8:13 의 비율을 생각해서 13폰트일때 아래위의 간격4 픽셀씩 하면 8픽셀이라는 비율이 나온다. 기존 폰트크기 13크기에 4를 더해서 라인하이트 값이 18이된다. 황금비 황금각도 황금비율 계산 사이트 metallicratio 2020. 8. 27. 타이포그래피 :: typography 타이포그래피 타이포디자인 가이드라인 본문 vs 제목 본문용 타이포 : 작은 사이즈에서 판독 및 가독이 편함. 간격이 넓음. 얇은 획을 포함. 제목용 타이포 : 강한개성과 정교함을 가짐. 판독성과 가독성 무시가능. 타이포 간격 : 답답하거나 심심하지 않다. 디자인 전반에 걸쳐 고른 간격을 가진다. 디자인의 디테일 부분에 해당한다. 타이포그래픽 일러스트레이션의 혼합 영문과 국문의 혼합의 경우, 폰트크기와 높이를 맞추어야한다. 세리프 vs 산세리프 (Serif, San serif) 타입 최고의 원칙은 세리프와 산세리프를 섞어서 사용하는것. 타입의 특징을 파악해서 사용한다. 가벼움 vs 무거움 (Light, Heavy) 무겁거나 또는 가벼운 무게의 타이포는 강한 시각적 대비를 이룬다. 이 테크닉은 종종 세리프체.. 2020. 8. 26. 그리드시스템 :: grid system 그리드 시스템 정의 : 페이지를 구성하는 정보를 의미있고 논리적으로 일관성있게 구성하는 것을 중요시하는 그래픽 디자이너에게 도움을 주는 정밀한 프레임워크(구조, 체제). 목적 : 정보에 질서와 구조를 부여한다. - 베이스라인(Baseline)기반의 타입디자인. 종류 원고그리드 원고 그리드는 간단한 구조의 그리드입니다. 주로 광범위하고 지속적인 텍스트 블록에 사용되는 단일 컬럼으로 만든 큰 사각형 영역입니다. 컬럼그리드 컬럼(열) 그리드는 페이지에 여러 개의 열을 배치할 때 사용되는 그리드입니다. 불연속 정보 및 콘텐츠의 요구를 제시할 때 유용합니다. 모듈그리드 모듈러 그리드는 컬럼 그리드와 유사하며, 로우와 거터를 추가한 그리드입니다. 다소 복잡한 프로젝트에 사용됩니다. 계층그리드 계층 그리드는 웹사이트.. 2020. 8. 25. 무드보드 :: moodboard 무드보드 & 컬러 정의 1. 사진, 텍스쳐, 패턴, 타이포, 컬러 등을 콜라주하여 하나의 보드에 자신의 생각을 표현하는것. 2. 보통 브랜드 디자인의 사전 작업 a. 자신이 생각하는 느낌을 팀원들에게 전달하기 위함 : 브랜드 디자인의 기획서(?) 예) 커피브랜드 : 카페 인테리어 이미지 + 부드러운 켈리그라피 + 모던한 느낌의 텍스처 + 라인일러스트 등 3. UX/UI 프로세스에도 적용가능. (디자인 시스템 및 컬러가이드) a. color guide b. type guide 어떻게 작업하는가? 정해진 양식이나 가이드는 없음. 본인의 개성이 드러나도록 작업. 리서치 1. 디자인 레퍼런스 사이트 리서치. (무드보드의 목적과 목적을 달성하기 위한 방법을 생각) a. 유행하는 UI디자인 b. 영감을 주는 사진 .. 2020. 8. 24. 이전 1 2 3 다음
