본문 바로가기
portfolio :: UI/UX Behance 링크가 열리지 않을 시 크롬 브라우저로 접속해보세요! 2020. 9. 23.
조너선 아이브 :: Jony Ive 조너선 아이브 누구나 좋아하는 디자이너 한명 쯤은 있을 것이다. 그중 가장 유명한 인물 중 하나를 뽑으라면 조니 아이브가 아닐까? 그의 최근 동향 및 요약을 통해 그가 어떤 사람인지 알아보고 그 주변에 어떠한 디자이너가 있었는지 확인해보자. 조너선 아이브 요약 1967년 교사인 아버지 밑에서 자람. 1989년 조니 아이브는 디자인 스튜디오 탠저린의 초창기 멤버였다. 하지만 하청디자인에 실망을 안게되어 퇴사를 결심한다. 1992년 애플에 입사 후 약 5년동안 애플에 있었다. 잡스를 만나게되어 전성기를 맞이한다. 최근동향 2019년 애플을 퇴사하고 마크뉴슨(Marc Newson)과 러브프롬(LoveFrom)이라는 디자인회사를 차리게 된다. 2020.10월 현재 에어비엔비의 고문디자이너로 사내 디자인팀과 협업.. 2020. 9. 21.
이것이 UX 디자인이다 :: this is UX design 이것이 UX 디자인이다. 라이트브레인 "조성봉" 님께서 지은 책인데 쉽게 설명이 잘 되어있다. 꽤 오래된 책이었는데 저번 달에 재 발행됐네. 간만에 UX에 대한 정리도 할 겸 책을 꺼내 정리해봤다. 1. Ux 디자인이란 UX 정의 "유저가 인지하는 경험의 품질" 1. 유저가. 2. (어떤 서비스나 물건을) 사용하고. 3. (이성적, 감성적) 판단을 내리는 것. 이라고 볼 수 있다. UX 디자인에 대한 오해. 1. UX = UI? UX는 총체적 관점, UI는 시각적 관점으로 보면 될 것이다. 즉, UX > UI, GUI, Interaction, IA, Process, contents...+(User의 니즈) 2. 부분적인 단계? - UX 디자인은 그 자체가 하나의 완결된 프로세스를 가지고 있다. 하지만 특.. 2020. 9. 13.
2020 디자인트렌드 :: 2020 design trend 2020 디자인트랜드의 고찰 트렌드가 빠르다고 UX에 꼭 도움이 되는것은 아니다. 트렌디한 디자인을 따라가다가 잘못된 사용성으로 서비스의 질에 누를 끼칠 수 있다는 말이다. 드리블과 인스타에서 주목받고 있는 최근트렌드를 살펴보고 그 트렌드의 문제점도 함께 생각해보자. 아 잠깐. 디자인트랜드를 이야기하기전에 기본적인 디자인 트렌드에는 어떠한것들이 있는지 살펴보고 가자. 기본 트렌드 1. 스큐어모픽 사물의 모습을 그대로 표현하는 디자인. 2. 플랫디자인 단순한 구성과 색상을 통해 직관적으로 인식할 수 있는 디자인. 3. 머티어리얼 디자인 구글이 개발한 시각언어로 그리드 기반의 레이아웃과 규칙적인 색상설계, 의도적으로 여백을 디자인. 새로운 트렌드의 문제점 1.뉴모피즘 (체험하기) 스큐어모피즘에서 탄생한 뉴모.. 2020. 9. 5.
미라클모닝 :: miracle morning 미라클모닝 퇴근 후 교보가서 혼자 이리저리 책을 구경하다 발견하게 된 책. 뭔가 기적이 만들이지지 않을것 같은 표지이다. 너무 평범한 책. 아마존 종합 베트트셀러 1위라는 저 카피에 호기심으로 한번 훑어보게 되었다. 그러다 꽤 괜찮은 인사이트를 얻었다. 글쎄 뭐랄까... "무언가를 억지로 이루는것이 아닌, 자연스럽게 이루며, 스스로에 대해 더 솔직하게 알고 , 내가 몰랐던 자유에 대해서 회복하기위해, 재미, 행복, 기쁨의 토양위에 좋은 습관을 쌓아가는것." 미라클 모닝이 필요하다 라는 생각이 들게되었다. step 1. Silience 명상 2. Affirmation 확신의 말 3. Visualization 시각화 4. Exercise 운동 5. Reading 독서 6. Scribing 글쓰기 이렇게 6가.. 2020. 9. 4.
해더 디자인 :: 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.
리액트 기초 :: React basic React 상식 React의 5가지특징 1. Element : 컴포넌트 최소단위 (header, h1, p, span ...) 2. JSX(javascript XML) : 자바스크립트 확장 문법 , 겉으로 보기앤 자바스크립트 + html 3. Component : 첫글자 대문자 a. function 형 i. ReactElement 리턴. (훅과 연동) b. class 형 i. State관리 (동적요소) ii. 훅이 클래스 컴포넌트를 대체가능 (클래스는 상대적으로 무거움) 4. Props : 데이터 동기화를 위해 사용됨 a. Read only (바꾸면 안되기 때문, 동기화니까) b. 위에서부터 데이터가 흐른다. 5. State : 동적데이터 a. 이벤트 우측에는 함수 선언문이 놓여야 한다. i. 함수 실행.. 2020. 8. 28.
황금 비율 :: . golden ratio 황금 비율 정의 : 고대 그리스에서 발견된 것으로 기하학적으로 가장 조화가 잡힌 비율로서 미적 감각이 뛰어나 붙여진 이름 특징 1. 황금비율은 시각적 안정감을 준다. 2, 조형적 아름다움을 위해서는 변형이 필요하다. (다양한 그리스 시스템 이해필요) 예시) 웹 디자인에 적용을 하면 폰트크기 13일때 라인하이트 값은 17이나 21이 좋다. 왜냐하면 8:13 의 비율을 생각해서 13폰트일때 아래위의 간격4 픽셀씩 하면 8픽셀이라는 비율이 나온다. 기존 폰트크기 13크기에 4를 더해서 라인하이트 값이 18이된다. 황금비 황금각도 황금비율 계산 사이트 metallicratio 2020. 8. 27.