AI와 디자인
-
portfolio :: UI/UX
Behance 링크가 열리지 않을 시 크롬 브라우저로 접속해보세요!
2020.09.23
-
chat-GPT :: (AI)가 우리를 대체 할 수 있을까?
인공지능은 인간을 대체할까? 결론부터, 중간 숙력도를 가진 사람들이 사라지게 될 것이다. 보조하는 직업을 가진 사람이 대체될 것이다. 화이트 컬러부터 대체될 것이다. 적은 수의 사람들이 하는 일보다 많은 사람들이 하는 일부터 대체될 것이다. 비싼 인건비가 드는 일이 대체될 것이다. AI는 초안 작성에 강하지만 완성도를 높이는것은 인간이다. 결국, 일자리를 뺏기는것이 문제가 아니라 삶의 의미가 상실될 수 있다. 일은 기계가하고 우리는 또 다른 몰입의 대상을 찾아야 할 수도 있다. 우리는 우리에게 즐거운 일을 찾아야하고, 좋은 태도를 가지고, 지속적인 변화에 발맞춰 나가면 된다. 우리가 대체되는것이 아니라 우리가 바 꾸는것이 되어야한다. AI시대, 우리에게는 어떤 가치가 중요한 시대가 되는것일까? 솔직..
2023.02.26
-
디자인 실무 미드저니 캐릭터디자인
소마사고력 수학의 캐릭터디자인을 미드저니를 활용해 만들어봤다. 소마수학은 초등학생들을 대상으로 하는 수학 교육 서비스이다. 학년별로 다양한 캐릭터를 제작했다. 1. 퍼즐 (1~2학년) 2. 수학튜터 (2~3학년) 3. 도형의 왕국 (3~4학년) 4. 제사장 소움 (4~5학년) 5. 퍼즐법사 소마 (5~6학년) 디자인 스타일은 귀여운 느낌부터 정교한 애니메이션 스타일까지 다양하게 시도했다. 이미지는 미드저니를 사용했고, 스토리는 GPT를 활용해서 제작했다. 인공지능을 활용해서 디자인을 한다는것은 손이 아닌 말로써 디자인을 하는것이기 때문에 프롬프트를 어떻게 입력하는가가 디자인의 아웃풋을 결정짓는다. AI가 어떻게 말을 하면 잘 알아듣는지를 AI입장에서 설명해줘야 한다. AI를 활용한 캐릭터디자인의 장단점을..
2023.08.05
-
미드저니 외 3가지 AI 비교분석
테스트 항목 1. 사진 : 실제와 동일한 이미지를 얼마나 자연스럽게 생성하는가? 2. 캐릭터 : 상상하는 대상을 얼마나 창의적이며 구체적으로 생성하는가? 3. 로고 : 상징성을 가진 이미지 작업도 가능한가? 4. 추상화 : 특정 작가의 스타일을 얼마나 잘 모방하고 개성있게 생성하는가? 5. 포스터 : 텍스트 + 이미지를 얼마나 잘 구현해 내는가? AI별 이미지 생성하기 1) 사진 주제 : 공부하는 학생과 선생님 (A Korean girl high school student studying with a male teacher in the classroom) 평가항목 : 형태, 빛, 표현력, 언어 이해 (이미지를 클릭하면 확대해서 볼 수 있어요) 이미지 형태 빛 표현력 언어 이해 실무 적용 firefly (..
2023.06.26
-
인공지능과 뇌는 어떻게 생각하는가?
저자 "인공지능과 뇌의 비밀을 알아가는길은 결국 우리자신을 더 깊이 알아가는 길입니다." 인공지능 연구자들이 인공지능을 만들기위해 얼마나 고민을 많이 했는지를 보여주는 책. 쉬워보이지만 개념위주의 책이고 나 같은 초보자들이 읽기에는 좀 어려운듯하다 ㅠㅠ. 하지만 완벽하게 이해한다기보다, 전체적인 맥락과 흐름을 이해한다는 측면에서는 꽤 괜찮은 책인듯. 특히, 인공지능을 구조적으로 분석해보는것. 몰아백의 역설(우리는 젓가락이 쉽지만 인공지능에겐 어렵다?), 인공지능의 사고구조의 오류를 인간의 생각을 통해 해결한다는 점에서 인간 지능의 위대함을 알 수 있다. 대표적인 예시 과적합 : 너무 세부적인것들만 보는 오류 / 과소적합 : 큰 그림을 볼려고하거나 빅데이터는 양은 많지만 균형을 맞추기 어려움. 과적합이나 ..
2023.03.19
-
디자인 벤치마킹 :: benchmarking
벤치마킹 디자인에서 드리블이나 핀터레스트를 혹은 비핸스를 레퍼런스의 가장 기본으로 생각한다. 하지만 콘셉트 레퍼런스를 찾기 전에 UX의 관점에서 어떠한 의도와 목적으로 레퍼런스를 찾아야 하는지 한번 생각해보자. WHY? 벤치마킹은 왜 필요한가? 1. 내부고객 설득: 이해관계자 및 클라이언트 설득. 2. 내부고객과 End유저사이의 눈높이를 맞춤. 3. 내부고객의 추상적 생각을 구체화. (인터뷰) 4. 아이디어를 뒷받침하고 확장시키기 위함. 5. 인터뷰를 대체할 정도의 효과 : 사용자들은 인뎁스 인터뷰에서 경쟁사에 대한 이야기를 하므로 충분한 경쟁사 분석은 인뎁스인터뷰 효과를 내기도 함. HOW 벤치마킹은 어떻게 찾아야 하는가? 1. 매크로 벤치마킹 (초기기획단계 :: 전략기획) - 전체적인 큰 틀의 벤치마..
2023.10.16
popular post
-
로티 :: lottie
로티 정의 : 애프터이팩트의 애니메이션 -> .json(자바스크립트 객체 : 코드화) 파일로 변환해주는 툴 디자인 작업을 하다보면 animation에 대한 욕구가 솓구칠 때가 있다. 하지만 리소스를 많이 잡아먹으면 어떻하지? 개발자가 반대할텐데... 이런생각으로 포기할때가 많다. 하지만 Airbnb에서 개발한 오픈소스 라이브러리가 있다. 애프터이팩트 (이하, 애팩)에서 작업한 파일을 json로 추출해주는 방식인데 메모리에도 영향을 적게준다. 자세히 알아보자. airbnb.design/lottie/ Lottie Easily add high-quality animation to any native app. Lottie is an iOS, Android, and React Native library that ..
2020.11.27
-
유저 플로우 :: user flow
user flow (이용 흐름 설계) 유저플로우(user flow)는 비슷한 용어가 참 많다. (task flow, wire flow, flow chart) 등등. 복잡한 듯 보이지만 하지만 한마디로 정의한다면 새로운 형태의 "와이어프레임" 정도로 정의하면 되겠다. 정의 1. 사용자가 특정한 작업 (task)를 완료하기 위해 서비스 내에서 움직이는 경로를 정리하는 것. 2. 사용자 시나리오보다 구체적이며, UI(화면), 행동, 판단으로 표현된다. 구성요소 1. 목표(user goal) : 사용자가 서비스를 통해 얻고자 하는 결과. (상품 구매, 정보 획득, 소통 등) 2. 작업(task) : 목표를 위해 유저가 수행하는 것. (로그인, 회원가입, 장바구니 담기, 검색 등) 3. UI: 화면. (검색화면,..
2020.11.23
-
인포그래픽 :: infographic
인포그래픽 정보의 양이 급속도로 증가함에 따라 비주얼 콘텐츠의 중요성이 강조되는 이 시점에서 사물에 대한 본질을 바라보는 통찰력이 중요시되고 있다. 그런데 텍스트로만 빼곡히 채워져 있는 정보가 있다면 누가 읽으려고나 할까? 그래서 정리해 봤다. 인포그래픽의 정의 1. 복잡한 데이터나 많은양의 정보를 단순화 시키는것. 2. 라인, 도형, 그래프, 다이어그램등으로 정보를 간소화하고 직관적으로 전달하는것. 인포그래픽의 종류 1. 통계형 인포그래픽 2. 지도형 인포글래픽 3. 대칭, 비교형 인포그래픽. 4. 프로세스형 인포그래픽. 적용사례 1. 웹사이트 2. 어플리케이션 3. SNS 및 기타 영상 매체 앞으로 갈수록 시각적인 의존도가 높아지게 될텐데 인포그래픽은 다양한 매체에서 제각기 다양한 영향력을 행사할것이..
2020.10.23
-
UX :: 이것이 UX / UI 디자인이다.
이것이 UX / UI 디자인이다. 1.1 Ux 디자인이란 UX 정의 "유저가 인지하는 경험의 품질" 1. 유저가. 2. (어떤 서비스나 물건을) 사용하고. 3. (이성적, 감성적) 판단을 내리는 것. 이라고 볼 수 있다. UX 디자인에 대한 오해. 1. UX ≠ UI UX는 총체적 관점, UI는 시각적 관점으로 보면 될 것이다. 즉, UX > UI, GUI, Interaction, IA, Process, contents...+(User의 니즈) UX 영역 1. UI 2. IA 3. user flow 4. Interaction 5. GUI 1. UI : 화면구성 2. IA : 정보의 전체 체계 (search, filter, tag, lable 등에 영향) 3. user flow : 사용자가 서비스를 이용하..
2023.09.23
-
데일리리포트 :: daily report
2023 데일리리포트 어느덧 2022년도 얼마 남지 않았다. 리포트를 쓴지도 이제 3년이 다되어 가는구나. 컴활을 따놓고 활용할 데가 없어 데일리 리포트를 만들어봤다. 특징 1. 집중도에 따라 하루 일과를 그래프로 확인 가능. 2. 쓸 시간을 미리 정해놓고 쓴다. (돈처럼) 3. 1년 안에서 -> 1달을 보고 -> 1달 안에서 1주와 하루를 본다. 4. 그래프를 통해 인풋이 많은지 아웃풋이 많은지 확인할 수 있다. 데일리 리포트를 시작했었는데 쓰다 보니 나만의 스타일이 생긴 듯하다. 혹시나 도움이 될까 싶어 공유해본다. 데일리 리포트 (편집이 필요하신분은 아래 댓글에 알려주세요!) 1. 한 주 반성하기 지난 한 주 간 자신의 집중도 및 기상시간을 확인하고 에너지 배분을 효율적으로 했는지 확인한다. 2. ..
2020.10.04
-
최고의 팀은 무엇이 다른가 :: The secret of highly successful groups
최고의 팀은 무엇이 다른가 동기 회사에서 복지로 받은책인데 2년전에 받은걸 이제서야 읽었다. 생각보다 좋은 내용들이 많이있었다. "팀은 개인보다 강력하고 큰 영향력을 지닌다. 하지만 서로 신뢰를 잃어버린 팀은 없는것보다 못할수도 있다." 팀 안에서 "문제점을 드러낸다는것은" "긴장감을 가진다는것은" "서투름과 힘겨운 피드백이 있다는것은" 결과적으로 신뢰와 협동을 불러올 수 있다. 주요내용 정리 chepter 1 1. 나는 이곳에서 안전한가 a. 꿀사과 vs 독사과 i. 꿀사과 : 1) 부드러운 리더쉽 2) 직접나서기보다 사람들의 여건을 만듦 3) 서로 끈끈하게 연결되어 있다고 느끼는 환경조성 4) 똑똑함
2020.10.06
-
디지털 트랜스포메이션 :: digital transformation
디지털 트랜스포메이션 :: 뉴 호라이즌 : 뉴 호라이즌 (new horizon) 디자이너 이상인 (현, 마이크로소프트 클라우드+인공지능부서 시니어) 이 사람을 알게된 건 "디자이너의 생각법" 이라는 책을 읽고나서 부터다. 그 전 부터 블로그나 sns상에서 다양한 활동을 했었지만 나의 경우는 책에서 얻은 인사이트가 깊었다. RGA 에이전시 출신 디자이너로 디자인도 잘 하시지만 글 또한 굉장이 잘 쓰신다. 인사이트도 있으시고. 그래서 이번책도 구매하게 되었고. 전쟁의 최전방에 있는 디자이너는 세상을 어떻게 바라보고 있는지 잠깐 보도록 할까? chapter.1 1. 디지털트랜스포메이션이란 a. 정의 : 프로세스 전반의 효율화를 위해 디지털의 힘을 빌리는것. b. 디지털에 적응하지 못하면 생존의 위협을 받는시대..
2020.10.13
-
컨셉트 디자인 :: concept deisgn
컨셉트 디자인 정의 광범위한 생각들의 형태가 명확하게 표현되는 단계로서 디자인 프로세스의 초기단계. (= 제안디자인) 포함영역 : UI, UX, strategy, interaction, visual. 1. 기획의도 파악 기획 내용에 대한 질문 및 고객 커뮤니케이션 2. 레퍼런스 - 경쟁사 서비스 종류 분석 - 경쟁사 UI 분석 - 고객사가 원하는 컨셉 분석 - 디자인 에이전시 트랜드 분석 - 컨셉표현 (아이덴티티, 비주얼, GUI) 경쟁사 UI 분석 더보기 패키지 여행서비스 - 필수요소 : 목적지 선택, 출발 날짜 및 기간, 항공 선택 등 제품을 선택하는데 있어서 꼭 필요한 UI - 선택요소 : 필터기능, 정렬기능, 태그기능, 찜하기 기능 등 없어도 되지만 있으면 편리한 UI 특별한 UI를 만들기 위함이..
2020.08.22
-
뷰 타입 :: View type
뷰 타입 GRID 형 정의 : 이미지 + 2개 이상의 세로줄을 사용한UI - 이미지가 대부분의 공간을 차지, 텍스틀 최소화. - 유저가 이미 목적을가지고 어떤콘텐츠를 선택할지 알고 있을때 유용함. - 이미지는 자극을 주어 급한선택을 할 수 있게 만들고, 전체콘텐츠를 보기위해 많은 스트롤을 해야한다는 단점. ex)인스타그램, 제품, 갤러리등에서 사용. LIST 형 정의 : 한 세로단에 모든 콘텐츠를 나열한 뷰 형태. 특징 : 텍스트 라벨을 훝어보고 자신이 원하는 정보를 빠르게 찾을 수 있도록 해줌. 종류 - 텍스트 형태 : 아코디언 사용으로 오버스크롤링 방지. - 텍스트+섬네일(아이콘)형태 : 리스트형 상품리스트. CARD 형 정의 : 콘텐츠가 있는 사각형 영역을 카드를 나열하듯이 배치해 보여 주는 UI ..
2020.08.11
-
그리드시스템 :: grid system
그리드 시스템 정의 : 페이지를 구성하는 정보를 의미있고 논리적으로 일관성있게 구성하는 것을 중요시하는 그래픽 디자이너에게 도움을 주는 정밀한 프레임워크(구조, 체제). 목적 : 정보에 질서와 구조를 부여한다. - 베이스라인(Baseline)기반의 타입디자인. 종류 원고그리드 원고 그리드는 간단한 구조의 그리드입니다. 주로 광범위하고 지속적인 텍스트 블록에 사용되는 단일 컬럼으로 만든 큰 사각형 영역입니다. 컬럼그리드 컬럼(열) 그리드는 페이지에 여러 개의 열을 배치할 때 사용되는 그리드입니다. 불연속 정보 및 콘텐츠의 요구를 제시할 때 유용합니다. 모듈그리드 모듈러 그리드는 컬럼 그리드와 유사하며, 로우와 거터를 추가한 그리드입니다. 다소 복잡한 프로젝트에 사용됩니다. 계층그리드 계층 그리드는 웹사이트..
2020.08.25
