사용자들의 경험을 좌우하는 인터랙션이 중요하다는말로 시작되는 강의였습니다. 브랜드이미지, 광고이미지, 고객지원, 판매점 분위기, 제품 포장 등등이 바로 사용자 경험이라고 하는데요. 프로덕트 디자이너는 UI와 UX 전반적으로 신경을 써야하는 작업입니다. 시작은 비주얼디자인이지만, 궁극적으로는 사용자 요구와 제품의 목표를 이루기위함을 잊지 말아야합니다. (본질의 영역을 기억해야하는거죠**) UI 디자인 프로세스 단계 1. 기획 2 디자인 시스템 구축 3. 와이어프레임 작성 4. 화면디자인 5. 프로토타이핑 6. 테스트 및 피드백 21강 강의는 전체적으로 지금까지의 강의 내용을 한번에 정리하는 내용이였는데요. 강의 들을 때마다 어서 하루빨리 나의 포트폴리오를 만들고 싶다는 의욕이 앞서는건 어쩔수 없나봅니다.(항상 의욕은 1등ㅋㅋㅋㅋ) 와이어프레임 설계 후, 레이아웃 설계할때는 그리드 시스템을 반드시 활용하자. 오늘은 클론디자인 디벨롭된걸 제출하는 날입니다. 아직 컴포넌트나 베리언츠 등등 모두 반영을 못한지라 디자인 적으로만 디벨롭이 완선된 상태입니다(22일차 업로드와 날짜가 꼬여서 21차가 더 늦게 올라가게 되네요) 다시금 한숨 돌리고 파이팅을 찾아보겠습니다! #디자인부트캠프 #UXUI디자인 #오즈코딩스쿨 #앱디자인의뢰 #국비지원

UX리서치의 개요? UX 사용자 경험 불편한 해당 화면을 개선시키는 목적이다! UX리서치의 필요성이 중요합니다! 데이터 기반의 의사결정이 가능하며 전반적으로 흐름을 개선할수 있기 때문인데요. 사용자중심의 디자인이 구현되어야 만족도와 충성도가 향상되고, 초기 단계에 리스크가 최소화 됩니다. 프로덕트 디자이너들은? 사용자의 관점 기반이 되어야합니다. UX리서치 종류? 정서적 리서치(숨겨진 행동과 태도를 이해하기 위함이며, 심층인터뷰나 포커스 그룹과 관찰이 그 예시라고하는데요. 어떤 특정페이지에서 오래머물러서 그화면이 예뻐서 인줄알았더니 알고보니, 다음으로 넘어가는게 어려워서 일수도 있다는거죠. 그런걸 발견하기 위한 리서치단계라고합니다. 여러 사용자들의 관점을 수집할수 있는 포커스 그룹 인터뷰도 있습니다. 대면형으로 1대1로 심층인터뷰를 진행 할수도 있구요. 정령적 리서치는 사용자들의 패턴과 추세를 수치화하는거구요. 설문조사나 웹분석이 많습니다. A/B테스트도 그 예시중에 하나입니다. 행동적 리서치는 사용자의 실제 행동을 관찰하며, 태도적 리서치는 사용자의 느낌과 생각을 파악하는 방법이 있습니다. 데스크 리서치의 이해와 방법론 기존의 자료를 수집하고 분석하며 정보를 얻는 방법, 문헌조사 통계분석 등이 포함되어 있습니다. 시간과 비용 효율성, 광범위한 정부 수집이 가능하며 초기 조사 단계에서 방향성 설정에 유용합니다. 신규 서비스의 경우 처...

안녕하세요! 이사를 앞두고 여는 마지막 지도 발송 이벤트입니다. 아직 수량이 조금 남아서 아예 보내드리고 가려고합니다. 25일 하루만 댓글로 받고, 26일에 오후에 일괄발송됩니다. 직접 지도를 제작하였고, 꼭 가봐야할 국내관광지 100선이 담겨있습니다. 아이들과 다녀온 곳은 깃발로 표시도 할 수 있도록 깃발스티커도 같이 보내드립니다. 이렇게 액자에 넣어두면 일러스트용으로도 오래오래 보관하실수 있어요. 아이들과의 추억을 소장용으로 남기기도 좋습니다🙏 고급스러운 종이로 제작해서 매트함과 두께감이 같이 느껴지는 좋은 재질입니다. 값싼 얇은 종이가 아니랍니다. 그래서 벽에 붙이고 오래 사용하실수 있어요. 아이 출산으로 판매하던 사이트를 휴업하게되었습니다. 그래서 제작해둔 지도를 이사를 앞두고 필요한 이웃분들에게 나눔하고자합니다. 그냥 보내드리면 좋겠지만 안전한 배송을 위해 배송비와 포장비만 받고 보내드립니다(5천원) 직접보면 더 예쁜데 화면에 다 안담기네요. 27일 이사로 인해서 26일에 일괄보내드리고자 신청은 25일까지만 받겠습니다🙏 다녀온곳 표시하면서 소중한분들과의 추억을 지도에 오래 남겨보세요. 🙏이런분들께 딱이예요🙏 매일 아이들과 어딜갈지 고민하시는분들 평소 돌아다니는거 좋아하시는분들 인테리어 지도 필요하신 분들 지도 필요하신분들은 댓글로 성함과 연락처 주소 남겨주시면 됩니다.

헤더메뉴(로고/네비게이션/CTA) 히어로 섹션(강렬한 메세지와 이미지) 콘텐츠 섹션(특징/사용자리뷰/가격 정보 등) 푸터(연락처 정보 / 소셜링크/ 간단한 메뉴) 컬러스타일 : 브랜드컬러 + 보조색상 (컴포넌트에 추가**) CTA버튼은 명확하고 시각적으로 돋보이게 디자인해야한다고하네요. 의사결정을 할때 시각적인걸 활용해야한다는 점에서 색감이 다시한번 중요하다는걸 배웁니다. 피그마는 오른쪽 메뉴에 레이아웃 그리드도 구성할수 있는 버튼이 있어서 간격 맞추기도 쉽더라구요(layout) 지금까지의 강의를 돌아보자면 오즈코딩스쿨 강의 퀄리티가 좋다. 그런데, 생각보다 빡세다 (그만큼 듣고나면 많이 성장해있을것 같다)인데요. 취업을 희망하는 비전공자들에게 딱인거 같아요. 육아로 바쁜 저도 중간에 쓰러지지(?!)않도록 쌤이 챙겨주시려는게 느껴지고 형식적인 수업을 위한 수업이 아니라, 수강생들 두루두루 살펴주시는게 느껴지는 강의입니다. 꼭 비전공자분들 중에 국비지원으로 디자인 강의 듣고 싶으신분들은 들어보세요! 그렇다면 저는 오늘도 클론디자인을 발전시키러 가보겠습니다. 해야할일 1) 클론디자인 디벨롭 2) 디자인 시스템 구축 3) 포트폴리오 가이드 설계

어느덧, 19차 강의로 달려가고 있습니다. 이사만 끝나면 조금 숨을 돌릴수 있겠습니다만, 지금은 뭔가 머리채 잡고 끌려가는 느낌이라 정신차리느라 바쁘네요. 그래도 오늘도 디자인 강의를 듣기 잘했다라고 남길수 있도록 집중해보겠습니다. UI 디자인의 3가지 핵심 원칙 1) 일관성 : 초록색(통화하기)- 빨간색(통화안하기) 이게 약속 처럼 일관되어야함 2) 가독성* 서비스를 제공해야하므로 가장 중요함 3) 직관성 : 사용자가 학습 없이 바로 알아보고 작동할수 있어야함 UI 디자인을 들어가기 앞서 앱 화면의 구성에 대해서 살펴보도록 하겠습니다! 디자인 시스템을 만드는 이유? 계속적인 작업의 일관성과 시스템의 효율성을 구축할 수 있기 때문이다! 앱 사용자의 동선과 주요 작업 시나리오 로그인 - 홈화면 - 상품 상세페이지 - 결제페이지 사용자가 최소한의 클릭으로 원하는 작업을 수행할 수 있도록 해야하며, 오류 상황에 대한 예외처리가 필요함( 잘못된 입력 시 메세지 표시 ) 앱 메인화면에 들어야가야하는 핵심 요소 배경을 구성할때도 그리드값을 미리 결정할 수 있는 사이트를 활용하면 편하다고 하네요. 이건 제가 아예 몰랐던 부분인데, 향후 앱 디자인 설계할때 꿀팁인거 같아요. 디자인 스타일 가이드 꼭 적용하기 기존에 쌤이 미리 만들라고 하셨던 디자인 시스템을 구축해서 사용하면 쉽게 적용할수 있겠네요. 상태 UI도 만들어두면 미리 디자인적으로 도움이 ...

이번엔 디자인 시스템에 대해서 배우는데요. 그렇다면 디자인 시스템과 스타일 가이드의 차이는 무엇인지 저도 좀 헷갈리기 시작할뻔했는데요. 기능적인 요소가 가미 되었다고 보시면될것같아요. 디자임 시스템 = 시각적 요소 + 기능적 요소(컴포넌트/인터랙션) 그렇다면 이제 디자인 시스템을 하나씩 시작해보겠습니다. 컬러시스템(일관된 시각적 요소를 위해) 메인브랜드컬러/보조색상/상태 색상(성공과 에러, 실패 등) 예시로 소카 컬러시스템을 보는것도 좋을것 같아요. 타이포그래피 시스템을 설정해서 서체 크게 자간 정의 입니다. 크기는 짝수단위로 가고 24가 보통 기준** 제목/부제목/본문/캡션에 대해서 설정이 필요해보입니다. 컴포넌트 라이브러리를 만들어야하는데요. 버튼 입력필드 카드 네비게이션바 등입니다. 추가로 아이콘 및 이미지 스타일 구축이 필요합니다 강의들을때는 욕심이 나는데 다듣고 나면, 다시 막막해집니다만! 비전공자이지만 그동안의 디자인기획을 배운 디자이너로써 하나씩 쌓아보겠습니다. 혹시라도 클론디자인 하시고 디자인 시스템 구축하시는 분들께 이 포스팅이 도움이 됬으면 하는 마음입니다. 다 찍어놔야 나중에 만들때 기억이 날 것같아서 놓치지 않고 다 담아봅니다. 이번주 과제도 지난번 내주셨던 클론디자인을 이어서 디벨롭시키는 겁니다. 파이팅 해보겠습니다만요. #앱디자인의뢰 #국비지원 #오즈코딩스쿨 #UXUI디자인 #디자인부트캠프

이제 정말 본격적으로 포트폴리오를 완성하기 위한 달이기가 시작된거 같은데, 아직 결승선에 들어가기도 전에 숨이찬 느낌입니다. 그럼에도 불구하고 혼자 포트폴리오를 준비하시는 분들에게 이 기록들이 조금이나마 공감과 희망이 되었으면 합니다. 어도비 익스프레스로 10초만에 만들기 일단 오늘은 스타일 고도화에 대해서 배워볼건데요. 한마디로, 제가 이해한건 나만이 가진 디자인 패키지라고 보면될거 겉아요. 디자인적인 통일감을 생성하는거죠! 이런 스타일 고도화는 크게 세가지가 있습니다. 첫번째는 컬러스타일 두번째는 텍스트 스타일 마지막은 이펙트 스타일입니다. 추후 디자인하고 나서 이 세가지를 차례로 점검해보는 것도 하나의 방법일것 같네요. 그러니까 이런식으로 컬로조합을 만들어서 저장해 두는 개념인거죠. 색깔만 마음에 들게 뽑아봤는데, 그것만 봐도 너무 예쁘네요ㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋ 글씨폰트와 크기도 마찬가지로 적용시킬수 있어요. 글자와 그림을 조합해서 글자에 그림을 입힐수도 있어요. 글자 넣고 그림으로 덮고 마우스 오른쪽 클릭 use as mask 사용하면되는데요.포토삽에 클리핑마스크랑 동일한 효과인거같아요. 반대로 이미지에 글자 부분만 팔수도 있는데요. 원하는 원하는 글자와 그림을 같이 선택하고 오른쪽 상단에 exclude selection 을 클릭해주시면 됩니다. 다음은 버튼 내 아이콘 동일하게 유지할 수 있는 기능인데요. 포토샵에서 작업했던...

안녕하세요? 기록으로 세상과 나를 잇는 일상작가 이음입니다. 오늘은 벌써 16일차 인데요. 나름 무언가 쌓이는 느낌이라 기분 좋은 하루입니다. [일관된 디자인을 유지하기 위해 디자인 시스템이 필요하며, 때문에 컴포넌트나 베리언츠 등이 나온것이다] 컴포넌트 개념 ** 반드시 오토레이아웃 설정을 해야함 ** 엄마 아이콘이 변경되면, 자식 아이콘도 변경되야하기에 중요한 기능 아!! 이제 반복해서 하니 조금 알것같습니다. 그러니까 하나의 메인 버튼(엄마버튼) 만들고 그 아래 딸린 자식 버튼을 만들어주면, 엄마버튼이 바뀔때마다 자식버튼도 바뀌는거죠!(아하하하하하하하하하하하하하하하) 작은걸 알게 됬지만 뿌듯하네요. ** 엄마버튼만들기-오토레이아웃걸기-컴포넌트걸기-옵션누르고 복사하기(자식버튼들 만들어짐) 오른쪽 메뉴에 state에 버튼이 나오게 하고 싶으면 아래와 깉은 네이밍으로 지어주면된다고 하네요. 엄마... 피그마가 다시 점점헷갈려요. 방금 이해했다고 신나했는데 다시 헷갈려서 울먹이는 나란 사람..ㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋ 아닙니다. 할수 있습니다. 그렇습니다. 다시해보겠습니다. 베리언츠 하나만... 하다보면 내가 뭘하고 있었는지 모르겠는 방황하는 비전공자...ㅋㅋㅋㅋㅋㅋㅋㅋ 이렇게 버튼 여섯개를 만들고 그 중에서 자동으로 하나를 고를수 있어야하는데 이번에는 3개밖에 안골라지는...... 길을 또 잃은 비전공자ㅋㅋㅋㅋㅋ...

#디자인부트캠프 #UXUI디자인 #국비지원 #오즈코팅스쿨 #uxui디자이너 #앱디자이너 #앱만들기 #디자인의뢰 #앱디자인의뢰 안녕하세요. 기록으로 세상과 나를 잇는 일상작가 이음입니다. 벌써 15일차 디자인부트캠프 시간이네요. 이사준비에 사업마무리에 육아에 오늘도 정신없지만, 정신차리고 한숨 돌리고 다시 시작해보겠습니다.(다음달 둘째 돌잔치 예약도 해야하는데 늦었다고 말하지 말아주세요...ㅋㅋㅋㅋㅋㅋㅋ 파워P 이기에 닥치면 하긴할겁니다!) 지난시간 피그마 기초를 배우고 오늘은, 한 단계 업그레이드 된 피그마 기능에 대해서 배워보겠습니다 컴포넌트, 베리언츠, 프로퍼티 컴포넌트란? 반복적으로 사용되는 디자인 요소들이라고 이해하시면 될것같습니다! 디자인의 일관성을 유지하고 작업의 효율성을 올리기 위해서, 그리고 개발자와의 협업을 용이하게 하기 위해서입니다. 그렇습니다. 저는 이걸 매번 포토샵으로 진행하는바람에 간격이나 여백 무시하고 그랬드랬죠! 키워드 : 메인 컴포넌트와 복제본(인스턴스) 단축키 : 커멘드 + 옵션 + K 비어있는 다이아몬드 : 컴포넌트 엄마 메인 디자인 네개 다이아몬드 : 인스턴트 자식 복사본 디자인 베리언츠란? 하나의 컴포넌트에 여러 상태와 스타일을 추가 할 수 있는 기능인데요. 기본/호버/비활성화로 변경할 수 있다고 하니 하나씩 알아보고자 합니다. 혼자 감탄하면서 신기하게 실습중입니다. 하나를 바꾸면, 하위 메뉴들이 ...

오늘의 배움은? uI 구성요소와 오토레이아웃에 대해서 알아보겠습니다. UI 구성요소에 대하여 한마디로 사용자와 소통하기 위해 쓰는 모든 것이 아닐까 싶은데요. 사용자들이 이용하기 쉽게 직관적으로 접근할수있게 도와주고, 시각적으로 영향을 주며, 브랜드의 아이덴티티를 강화시킬수 있다는 점에서 중요하다고 볼수 있겠는데요. 제가 개발자분께 [하단바, 하단바]부르던게 네이게이션이였다니요!!! 그외에도 콘텐츠 카드와 팝업 경고창 등이 있습니다. 오토 레이아웃에 대하여 UI요소가 자동으로 정렬하는 기능인데요. 일관적으로 디자인을 유지할 수 있다는 장점이 있는데요! 단축키는 [쉬프트 + a ] 입니다. 한마디로 쉽게 디자인적인 일관성을 유지하기 위한 키라고 보시면됩니다. 어떤 하나의 버튼이 들어가는게 아니라 동일한 여러개의 버튼이 들어가는데 디자인을 하나 수정해야할때 일괄로 쉽게 수정할수 있는 개념인거 같아요. 하단바에 버튼들의 순서 또한 자유롭게 변경할 수 있는 기능도 있더라구요. (강의를 들으면 들을 수록 앱은 피그마로 만들어야한다는 확신이 이제야 드네요..ㅋㅋㅋ) 중간 간격에 대한 일관성도 유지되어서 하나를 변경해도 똑같이 유지되어야하는 간격이 동일하게 바뀐답니다(세상에나...) 오토 레이아웃은 여러 아이콘들을 품은 특정영역(프레임) 고정시키거나/ 같이 따라 움직이거나도 가능하게 할 수 있다고 합니다. 피그마 중에서 도 아마 유용한 기능중 하...

#국비지원 #디자인부트캠프 #오즈코딩스쿨 #UIUX디자이너 #앱디자인의뢰 #앱디자인 잇님들 안녕하세요. 기록으로 세상과 나를 잇는 일상작가 이음입니다. 네, 그렇습니다. 오늘은 피그마에 대해서 본격적으로 공부하는 시간입니다. 하, 피그마 하면 떠오르는 기억이 있는데요(회상) 앱 개발자분께 제가 직접 디자인을 한다고 했을때였드랬죠... 제가하고싶어서라기보다 남편 사업을 도와주면서 조금이라도 지원금을 아끼고 정해진 기일이 촉박했기에 제가 할수밖에없었는데요. 엄마, 정신을 차려야죠~ 개발자님: 이음님 피그마 파일로 넘겨주세요. 나: 네?.. 그게뭐죠?.. 포토샵은 안되나요? 개발자님:!!!!? 그게뭐죠? 먹는건가요?피그말리온은 아는데요? 그렇게 개발자와의 긴 여정이 시작되었고, 피그마로 쏘아올리지 못한 공이 난리를 일으킬줄을 그때까지 몰랐드랬죠. 그래서 이제야 말로 제대로 배워보겠숩니다 들으면들을수록 제가 개발자님께 정말 잘못했다는 반성을하게됩니다(사랑해요개발자님...) ㅋㅋㅋㅋㅋㅋㅋ 이렇게 많은 장점이 있으니 사용을 많이 할수밖에요! 예전에는 어도비 엑스디랑 스케치라는 프로그램도 있었다고 하네요, 엑스디는 디자인 협업이 조금 어려웠다는 단점이 있었다네요. 그리하여 그런 시장에서 살아남은 피그마인데요. 피그마에 대한 기본 툴을 대체로 포토샵이랑 비슷한거 같은 느낌이면서 아닌거 같으면서, 개인적으로는 어색해서 그런지 더 다루기가 어려운거같아...

#국비지원 #오즈코딩스쿨 #UIUX디자이너 #디자인부트캠프 #앱만들기 #어플제작 안녕하세요 잇님들 오늘은 UI설계와 와이어프레임, 워크플로어, 실제사례에 대해서 공부해보겠습니다. UI란? 사용자가 제품을 쉽게 이해하고 사용할수 있도록 계획하는 과정 어플은 그냥 만드는게 아니라 사용자의 행동패턴을 이해하고, 직관적인 인터페이스를 제공해야합니다.(기억하자) 매번 제가 생략한 부분이 아닐까 싶습니다. 이렇게 또 한번 반성해봅니다. 탈모엔딩 앱을 만들때 디자인일관성을 지키긴 했으나, 제 피셜과 프레임 잘된걸 캡쳐해서 구성만 따서 만들었는데... 피그마에 이미 기본적인 것들이 많이 담겨있다는 사실이 충격적입니다만! (이래서 사람은 배워야한다고 하나봅니다) UI 설계에서 중요한것은? 기능을 체계적으로 정리하고 정보가 논리적인 흐름을 가지도록 해야한다. UI 설계 과정은? 출처 UI설계 과정 오즈코딩스쿨 강의 즉, 정리하자면? 고객이 이런게 필요하겠다는 찾고, 어떤 정보를 담을지 적고(워딩), 대략적인 뼈대(와이어프레임)을 그린뒤에 이를 기반으로 어떤 흐름으로 갈것인가 어떤 버튼을 누르면 어디로 가고 어떤 작동이 될것인가? 프로토타입이라는 피그마 기능이 있으니 실제로 반영하기, 마지막으로 대충 그린걸 디자인하기(시각적 완성) * 기존꺼를 리디자인하려면 VoC 등등 확인하기 보자보자 어디보자, 그렇다면 이제 각각 상세하게 알아보자. 사용자리서치 사...

#로고디자인 #간판디자인 #로고디자인의뢰 #로고만들기 #프로덕트디자이너 퍼스널컬러를 진단하는 컬러코드의 로고 공모전에 참여한 포트폴리오입니디. 색상환을 나타내는 타원형을 기반으로 글자를 제작했으며, 비코드가 삽입 되었으면 좋겠다는 주최자의 의견을 담아봤습니다. 제작 하고 수상을 확신했지만, 아쉽게 탈락했습니다. 다시보니 C/C글자가 너무 올드한 느낌을 주었다는 생각이 드네요. 또한 두개를 합친 심벌이 별다른 의미를 담고 있지 못하다는 점도 이제야 보이네요 실제 수상작은 아래와 같습니다. 심플한 로고에 잘어울리네요. 글자 사이사이에 바코드와 색상환을 넣어 제작했는데요 트렌디하고 담담하게 담아내서 좋은 디자인으로 보이네요 그리고 보다 직괸적으로 퍼스널 컬러 진단 회사라는게 한번에 느껴지구요. 춯처 라우드소싱 우승작에서 배운점 로고(심벌)과 글자 타입에 하나로 합쳐질수도 있다는걸 생각해보게 되었다. 컬러코드라는 글자가 브랜드 이름인데, 심벌과 하나의 이미지로 담을 수도 있다는걸 배우게 되었다. 목업 패키지들도, 퍼스널 컬러를 더 잘 보여줄수있게 이미지도 넣고 밝은 조명의 심플한 조명간판 목업을 사용한 점도 높이 평가할만 했다. 엄뫄, 레츠꼬! 그러니까 다음엔 고정관념을 탈피하고 상징성을 더 녹여내야겠습니다. 주최자들의 의견을 더 세심하게 들어보고, 목업도 어울리게 배치해봐야겠습니다.

잇님들은 지금 어떤 집에 살고 계신가요? 도대체 울타리는 왜 누구를 위해 존재하는가...! 저는 감사하게도 너무 좋은 기운이 넘치는 집에 살다가 이사를 준비중에 있어요. 두 아이도 이 집에 살면서 생기고, 남편 사업도 시작하게 되고 나름 애틋하고 따듯함이 느껴지는 집이였는데 막상 이사가려고 하니 아쉬움이 크네요. 그래서 오늘은 이사전 점검해야할 사항에 대해서 메모겸 정리해보고자합니다.먼저 이사를 나가는집(지금사는집)에는 무엇을 해야할까요? 1) 가스끊을지여부 (추후 세입자 바로 들어온다면 끊지 않고 정산만) 2) 관리사무소 통보(엘베사용/사다리차 사용 관련) - 저층이라 사다리차 이용 패스 3) 이사짐센터 짐체크(견적산출) 및 기일확정 - 숨고를 통해 온라인 견적으로 해결 4) 주소변경 - 일괄신청하는 우체국 주소이전 서비스 알아보기 방마다 날짜를 정해서 정리하기, 월요일은 부엌 화요일은 거실 수요일은 베란다...그런데 요일이 너무 부족한건 함정이다....(좌절) 5) 자체 이사짐 1차 정리(버릴거 버리기) - 상태도 별로고 안쓰는 물건 쓰레기통행 6) 자체 이사짐 2차 정리(당근 내놓기) - 당분간 셋째 계획이 없기에 아기물건은 모두 당근행 - 집에 상태좋지만 안쓰는 물건 당근행 7) 자체 이사짐 3차 정리(분리/정리) - 거실이면거실 부엌이면부엌 필요한 자리에 필요한 물건 놓기, 지금은 난리 오분전이라 부엌에 아무거나 있으니 모두...

UI는 앱 뿐만 아니라 제조 제품에도 적용된다. 사용자가 제품과 상호작용하는 시각적/물리적 인터페이스이며, 컬러와 타이포그래피 그리고 아이콘이다. 고객이 봤을때 미적인 요소가 더 가미가 되는 개념이다. UX는 사용자가 제품이나 서비스와 상호작용하는 과정에서 얻는 총체적 경험을 말하는데요. 약간 개념이 모호할수도 있는데, ‘포켓몬고’처럼 어떤 일정의 사용자의 사용 전체 흐름이라고 이해하면 될 것 같아요. 상호작용하는 과정에서 얻는 총체적 경험 중 행동요인도 있는데요 대표적으로 당근마켓이라고 하네요. 제품이나 서비스를 이용할때 익숙한 방식 (이미지 캡쳐나 스크롤이나 클릭 등) 어린 아이도 가진 건데, 쌤도 강의에서 말했듯 이제 37개월 밖에 안된 아들도 핸드폰 넘기는걸 24개월 즈음부터 했으니 그게 가능하다는거 자체가 행동 방식이 신기하긴 한거 같아요ㅋㅋㅋ 어떤 것을 필요로하는 욕구들이 있는데 이런 욕구가 앱으로 드러나는 경우가 많은데요 뭔가 하고 싶다는 욕구로 어플이 만들어지는거죠 집에서 음식을 배달받고 싶은 욕구(배달의민족) 비대면으로 중고거래하고 싶은 욕구(중고거래) 정서적 반응의 예시는 페이지 오류 일때인데요. 당황하셨죠 같은 정서적으로 공감을 해주고 안내를 유도하는 경험인거 같아요. 생각보다 많은 것들이 앱에 담겨 있다는걸 이제야 알겠네요 스타트업이 실패하는 가장 큰 이유는 고객이 원하지 않는 제품이라고 합니다 때문에 UIUX디...

#오즈코딩스쿨 #국비지원 #디자인부트캠프 #UXUI디자인 #파이어플라이 문제를 해결하는것이 바로 디자인이기에 사람의 감정과 행동을 유도하는 도구로써, 심리학이 연결될수 밖에 없다는 쌤의 멘트가 와닿았는데요. 사실 이번에 로고 디자인에 참여했고 저의 피셜로 99프로 수상하면 어쩌지 하는 생각을 했는데, 탈락했거든요. 그런데 제가 참여했던 공모전의 수상작을 보니 저보다 로고 자체가 뛰어나지 않는데(이것도 제 판단이겠지만요) 의뢰자가 원하는 심리를 잘 읽었다고 느껴지더라구요! 그래서 더욱 쌤의 멘트가 와닿았어요. 한해 농사를 망했던 사과 농장에서 떨어지지 않고 살아남은 사과들만 리패키징해서 대대적으로 홍보를 잘한 사례를 알려주셨는데요. 이런 설명을 들으면 디자인은 정말 번뜩이는 대단한 힘을가진 무언가가 있는거같아요. 그 중에 가장 유명한게 바로 애플 시리즈 일텐데요 쌤도 마우스 말해주셨는데 저도 큰맘먹고 구매한 애플 마우스 집에 있는 왠만한 옷들보다 비싼 애플 마우스 인데요 사실 그냥 마우스인데 뭔가 그립감이 더 좋은 느낌이고 뭔가 더 잘 작동되는 느낌이고 그냥 뭐든 다 좋은 느낌인데요ㅋㅋㅋㅋㅋㅋ (사긴했지만 디자인할때 불편해서 손가락으로 한다는 건 비밀입니다...) 빨간색을 활용한 사례로 맥도날드를 말해주셨는데요 이제 37갤되는 아들도 롯데리아 로고는 기가막히게 알아서 보기만해도 감자튀김 먹겠다고 하는걸 보면 대기업들이 디자인은 참 잘 ...

지난 시간에는 어도비 파이어플라이에 대해서 배웠는데요. 오늘은 어도비 익스프레스에 대해서 알아보고자 합니다. 혹시 잇님들은 캔바, 미리캔버스를 아시나요? 간단한 디자인 템플릿이 있어서 비전공자들도 쉽게 디자인 제작물을 만들수 있는 프로그램인데요. 어도비에서도 그런 프로그램을 만든게 바로 어도비 익스프레스 라고 보시면되요. 이미 캔바를 사용해본적이 있는 저로써는, 익스프레스 사용이 낯설지가 않더라구요. 익스프레스의 장점은 영어에서 비슷한 영어 폰트를 추천해준다는 점인데요. 단점은 한글 폰트는 좀 제한이 있다는 거라고 하시네요. 익스프레스도 파이어플라이와 마찬가지로 생성형 이미지를 만들수 있는데요. 쌤의 설명으로는 파이어플라이에서 만들 수 있는 일부 이미지가 어도비 익스프레스에서 사용가능하다고 하시는거보면, 좀 더 세밀한 생성을 위해서는 어도비 파이어플라이를 이용하는게 맞겠다는 생각이 드네요. 익스프레스에서는 보다 간단한 이미지 생성에 적합한 프로그램같아보여요. 원하는 도형안에도 이미지를 넣을 수 있어요.포토샵에 클리핑 마스크 같은 개념인거 같습니다. 쌤이 말씀해주신 꿀팁 어도비 익스프레스에서 흥미로운 기능은 텍스트의 재질을 입힐수 있다는건데요 오오! 이것도 AI에게 원하는 재질을 말할 수 있어서 유용하게 사용될만한 기능같네요. 09 오늘의 과제는 AI활용 브랜드 에셋기반 카드뉴스입니다 #오즈코딩스쿨 #국비지원 #디자인부트캠프 #UXUI...

#오즈코딩스쿨 #UXUI디자인 #파이어플라이 #국비지원 #디자인부트캠프 두둥 오늘은 어도비 파이어플라이에 대한 이야기를 해보고자합니다. 쉽게 말하면 AI 인공지능이 생성형 이미지를 만들어주는 프로그램이라고 보면되는데요 위에 그림도 인공지능이 만들어준 이미지인데요 옛날엔 이런 이미지를 구하려면 직접 촬영하거나 아니면 이미지를 샀어야했는데요 지금은 원하는 멘트를 적으면 이렇게 이미지를 만들어주는 시대에 살고 있다는 놀라운 사실!!!! 파이어플라이 링크 주소는 다음과 같습니다. 무료로 월 25개씩 생성이 가능해요 (근데 만들다보니 이것도 적다고 느껴지더라구요) 그리고 어도비에서 만든 파이어플라이는 저작권에 문제가 없다고해요 즉, 기존에 저작권이 만료된 이미지들을 모두 모아서 이미지를 생성하기 때문에 저작권에 제약 없이 사용할 수 있는게 장점이랍니다. 이런 알록달록 케이크 폭파 이미지도 생성형 이미지로 만들어낼 수 있는데 개인적으로 이런 이미지가 제 취향인거 같아요 어떻게 이미지를 뽑아낼 것인가? AI에게 말을 걸때는 프롬포트가 필요한데요 보통 배경과 사람 혹은 사물/행동을 넣어서 이미지를 생성하면 되는데요. 예를 들어 산 배경에 정장입은 여자가 서류 가방을 들고 있다 이런식으로 3가지 요소가 들어가야 적정한 이미지가 생성되는거죠 쌤이 이번주에는 퍼스널 브랜딩 하는 방법도 알려주셨는데요 저는 육아하는 디자이너 이음입니다 로 결정했답니다 그리...

#국비지원디자인 #국비지원 #오즈코딩스쿨 #디자인부트캠프 #UXUI디자인 #AI디자인 오늘은 AI시대에 디자인에 대해서 배웠는데요. 어도비 파이어플라이 피그마에 대한 이야기를 나눠봤습니다. 친언니가 AI맹신론(?!)자여서 이미 친숙한 AI인데요. 초이가 말을 안듣는다고 했을때 조차도, 친언니는 챗GPT에게 37개월 아이의 훈육 방법을 알려달라며 물어봤드랬죠ㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋ 사실 저도 써야지써야지 하고, 아직도 왜 아날로그 방식을 쓰고 있는지 모르겠습니다만 앞으로는 더 친숙하게 활용해봐야겠습니다. AI를 쓸줄 아는 사람의 생산성은 다르다. AI에게 말걸려면, AI어를 배우라고 했는데 그게 프롬프트인가보다! 나는 왜 아직도 AI랑 소통이 잘 안되는지 모르겠지만 여전히 답답함이 있는거같아. 아마도 내가 프롬프트를 완벽히 이해하고 있지 않아서 그런거같으니 이번기회에 잘 배워봐야겠다. 많은 사람들이 가진 정보를 잘 활용하고 있다. 챗GPT를 가지고 수익화를 내도록해봐라(예, 전자책 크라우딩 펀딩)의 말이 많이 와닿았는데요. 뭔가 항상 일회성으로 디자인을 하고 버리고 하고 버리고 한 느낌이라서 디자인은 특히나 경력적으로 내공이 쌓이지 않는 부분이 있었는데요. 오늘은 강사님과 AI에 대해 전반적인 이야기를 나눠봤는데요. 이제는 진짜 해야할것같은 AI프로그램 이용!! 지금까지 AI활용을 안해본게 아니였어요. 부업으로 그리는 카카오...

오늘도 기분좋게 초이 등원시키고 둘째 재우고 강의 스타트 합니다 등원버스가 익숙해진 초이 스티브잡스가 유일하게 들었던 대학 강의가 타이포그래피라는거 아시나요? 글자를 그림처럼 활용하는 글자의 시각적 활용법인데요. 이전에 디자인 기획 사이버 강의를 들었을때도 가장 애매하고 어렵게 느껴진 부분이있었는데요. 뭔가 쉽게 표현할수 있을거 같은데 막상 디자인하면 좀 표현이 안되더라구요. 포토샵에서 마찬기지로 텍스트 글자의 크기와 색상 자간 등을 다양하게 설정해서 타이포 그래피를 만들수 있겠죠? 보통은 제목/부제목/본문으로 구성하게 됩니다 텍스트 정렬의 가이드를 활용하면 쉽게 배치할수 있어요 글자와 글자사이의 간격이 일정하면 균형감을 부여할수있다 텍스트 변형은 레스터화해서 도형으로 만들어주고 작업을 시행해야한다 편집-자유변형 기능 편집- 뒤틀기 기능 (크기를 가지고 비정형적으로 움직일수있음) 글씨를 어느정도 왜곡하느냐에 따라 느낌이 달라짐 포스터 레이아웃 정하기 가장 먼저, 시각적 중심잡게 포스트에서 주목을 끌어야할 핵심 영역 정하기 그동안 포스터 만들때 가장 기초적인걸 놓친거 같더라구요. 핵심 영역을 정해본 적이 없는 비전공자(하핫?) 앞으로는 포스터를 제작할때 가장 먼저 들어오게 할것이 무엇인가 생각(기획)하고 포스터를 제작해봐야겠습니다 그리드와 가이드를 잘 활용하는것도 하나의 방법이라고 하니, 디자인 할때 여백의 간격들을 잘 활용해봐야겠습니...