UIUX
-
[제로베이스]UIUX디자인스쿨 8주차_03UXUI/학습일지 2023. 7. 29. 23:45
남은 일정 및 진행도 그룹 프로젝트제작한 와이어프레임 제출(100%) - 와이어프레임 회의(100%) - 와이어프레임 시안 선정(100%) 포트폴리오 과제 - 주제선정 3개 (100%) - 내용 작성(100%) - 과제 제출 전 검토(0%) - 파일 정리(0%) 벤치마킹 인프라 - 벤치마킹 인프라 구축(100%) - 벤치마킹 폴더트리 제작(100%) - 한 페이지 만들기(100%) - 과제 제출 전 검토(0%) - 파일 정리(0%) 클론 디자인 - 앱 선정(100%) - 스크린샷 모음(100%) - 스크린샷 정리(100%) - 클론 디자인(40%) - 각 UI 필요한 이유 10가지 이상 작성(0%) - 과제 제출 전 검토(0%) - 파일 정리(JPG파일, 원본파일 압축)(0%) 레퍼런스 분석 - 앱 선정..
-
[제로베이스] UIUX디자인스쿨 3주차_05 '디자인툴, 뭐가 좋을까?'UXUI/학습일지 2023. 6. 25. 22:53
몇달 전 독학으로 배운 피그마를 과제를 하면서 활용하고 있다. 미리 배워서 어딘가 쓸모있다고 생각한 것은 이번이 처음 아닐까? 기분이 묘하다. 지금은 아는 게 부족해서 뛸 수는 없지만 오래 걷는 힘으로 꾸준히 배워나가야겠다. 디자인 툴 뭐가 좋을까? 내가 그림 그리는 것 외에 디자인을 위해서 써본 툴은 아직은 피그마와 XD 뿐이어서 이 둘을 비교해보려고 한다. 1. 피그마 내가 생에 처음으로 접한 디자인툴이다. 그전에 어도비XD를 들어보긴 했지만 다운로드 받아야하고(당시 나의 랩탑은 정말 엄청난 고물이었다.) 어도비 회원권을 사야하고 이것 저것 복잡하다고 느껴서 고민하던차에 피그마를 발견했다. 내게 진입장벽을 허물어준 이 고마운 친구를 소개하고자 한다. * 피그마는 기본 이상을 한다. - 벡터 기반의 디..
-
[제로베이스]UIUX디자인스쿨 3주차_04UXUI/학습일지 2023. 6. 25. 22:36
Chapter 7. 프로토타입 Prototype 7-1 프로토타입 Prototype프로토타입이란출시하고 싶은 프로덕트의 초기단계모델로써 사용자가 과업수행을 할 수 있게 네비게이트 할 수 있을 정도로 만든 시제품으로 말보다 더 효과적으로 디자인의 의도를 전달한다. Lean Process에서 강조. 빨리 만들어서 빨리 테스트 해서 빨리 개선한다. 이 과정을 반복하는 게 핵심 1. Lo-fi prototype : No time + Early stage = Concept evaluation장점 머리속에 있는 것을 시각적으로(촉각적으로까지) 표현, 저렴한 제작 비용, 손쉬운 수정 2. Hi-fi prototype : Time + (Almost) Final stage = Realistic usability장점 인터..
-
[제로베이스]UIUX디자인스쿨 레퍼런스 분석 2 '챌린져스 'UXUI/레퍼런스 분석 2023. 6. 25. 18:38
챌린져스 챌린지만 하는줄 알았더니 앱테크도 하고 영양제를 챙겨먹을 때마다 할인도 받는다고? 습관관리형 커머스 챌린저스를 알아보자 나에게 필요한 좋은 습관을 챌린지 목표로 고르고 동기부여를 높이기 위해 돈을 걸면 실천할 때마다 환급금을 받을 수 있다. 실패하면 벌금을 건 돈에서 벌금과 함께 차감되지만 성공할 경우 본인의 원금 + 다른 참가자들의 미환급금 일부를 합쳐 상금으로 받을 수 있다. 조사하고 싶은 이유 UXUI 디자이너로 성장하고 싶어서 스터디그룹을 들게 되었는데 챌린저스라는 앱으로 그룹원들의 학습도를 관리하기 위해 가입하게 되었다. Daily UI Challenge를 하면서 시간정보가 포함된 사진과 뭘 했는지, 고민했는지, 배웠는지에 대해 글로 남기고 '인증'을 누르면 간단히 그날의 도전을 완성하..
-
[제로베이스] UIUX 디자인 스쿨_프리스쿨UXUI/학습일지_프리스쿨 2023. 6. 2. 23:59
프리스쿨 Image box 20230602 배너나 프로모션등에 이미지영역과 텍스트영역을 크게 구분하여 사용 콘텐츠의 성격에 따라 사이즈, 위치를 지정하여 통일감을 부여 * 해당 배너와 유사한 배너 제작 시 가이드를 만든 이미지 영역을 사용하여 통일감 있게 만듦 * '가이드화 한다.' -> 어디까지를 이미지 영역으로 쓸 것인가에 대한 정의가 필요 * 최대 글자줄수를 고려한 이미지 가이드 * 좌측 마진값은 고정으로 두지만 우측 마진은 유동적이다. 그래도 좌측 마진값만큼 넘게 텍스트 추가를 하진 않는 편 위 작업물이 바로 세줄까지 작성할 때를 대비해서 만든 이미지 가이드와 그 결과물이다. [실무팁] 이미지영역과 텍스트가 오버랩이 되게 제작할 때도 있긴 있으나 후속 디자인을 위해 협의가 필요하다. [유의] 배경..
-
[제로베이스] UIUX 디자인 스쿨_프리스쿨UXUI/학습일지_프리스쿨 2023. 6. 1. 23:29
프리스쿨 Tab 20230601 페이지 내 유사한 정보를 그룹핑하여 콘텐츠를 정리할 때 사용 여러 섹션을 신속하게 전환할 수 있게 함 탭이 표현하는 정보의 볼륨에 따라 뎁스라는 위계가 생기며 해당위계를 탭에도 시각적으로 표현 하위뎁스가 상위뎁스 위로 표현되는 것을 권장하지 않음 * 상위뎁스(Depth)에서 하위뎁스로 갈수록 볼륨감이 적어짐 * 뎁스 간 차이를 둘 것 * 같은 뎁스라도 활성화인지 비활성화인지에 따라 폰트 무게감에 차이를 주기도 한다. [실무팁] 각 메뉴의 on(활성화)/off(비활성화) 버전을 동일하게 만들어 준다. 요소 간 간격은 짝수로 하는 것이 좋다. [유의] 아이콘을 만들 시 가이드 도형을 삽입해서 간격을 균형 잡는다. [나의 생각] 강의는 40분이 채 안 되는데 디테일을 강사님과 ..