비전공 개발자 캐나다 브리

데브리입니다. 지난달부터 갑자기 UI UX에 관심이 많아지기도 했고, 일하는데 도움도 될 것 같아서 유데미에서 Figma 수업을 수강했어요. 한동안 유튜브에서 UI 디자인 수업을 랜덤으로 찾아봤었는데 아무래도 유데미처럼 온라인 수업으로 딱 정리된 게 저는 집중해서 따라가기 더 좋더라구요. 유데미에서 UI UX 디자인을 검색해서 나오는 강의들 중에 가장 인기가 많고 리뷰도 좋은 Daniel Walter Scott의 수업으로 골랐습니다. 총 수업시간 : 11.5 (하루 1-3시간 정도씩 투자해서 수료하기 까지 10일 정도 걸렸어요.) 좋았던 점 : 따라하기 쉽게 꼼꼼하게 잘 설명해주는 편이고, 섹션마다 과제가 있어서 배운 내용을 꼭 복습하게 된다는 것. 아쉬웠던 점 : dad jokes. 깔끔하게 잘 정리된..

가상의 페르소나를 만들 수 있는 사이트 Random Project Generator https://randomprojectgenerator.com/ Wireframes - 다운로드 받을 수 있음 Free icons 다운받을 수 있는 사이트 icon finder https://iconfinder.com png vs svg 차이? png: 크게 확대하면 깨짐, 큰 사이즈로 받을 경우 파일 사이즈가 큼 svg: 깨지지 않고 파일 사이즈가 작음. Figma에서 vector 파일로 분리해서 컬러를 바꿀 수도 있음. 2. figma community 거의 무료버전이고, Fig pick이면 괜찮은 퀄리티 duplicate - detach instance Plugins 활용할 것 Testing a prototype o..

1. mobile font font-size mobile: 12px 이상 / 24px 이상 desktop: 16px default font size (1em) text-align 3줄 이상 넘어가면 text-align: left가 가독성이 좋음. font-family 통일감 있게 1, 2가지만 사용할 것 font-weight 2-3가지만 써도 충분. 넘어가면 복잡해 보임 font color 폰트 컬러는 접근성 4.5:1 이상? (Contrast Ratio 인가?) 브랜드 컬러로 강조하는 건 좋지만, 너무 여기저기 쓰지 않도록 절제하는 것이 중요 2. button font-size 16 px 손가락 굵기를 생각해서 여백은 넉넉하게 계층 구조: 강-중-약 (중요도에 따라 계층 구조를 나눔: 로그인, 예약하기..

현재 진행 중인 프로젝트 1. 쇼피파이 작년 말부터 진행 중이고 제가 한국에 가있던 두달 동안은 참여를 안했지만 여전히 프로세스가 너무 더딘 프로젝트. 지난달엔 거의 마무리 단계라는 이야기를 들었는데, 갑자기 theme을 바꾸는 바람에 제가 몇 달간 집중해서 작업했던 부분이 쓸모없게 되어버렸어요. 직접 클라이언트와 대화할 수 있는 프로젝트가 아니고 전달해주는 내용을 받아서 수정만 하는 입장이라 구체적인 진행 상황도 파악할 수 없고, 진척이 없어서 여러모로 답답하긴 하지만 그래도 이 프로젝트 덕분에 처음으로 쇼피파이를 다뤄볼 수 있었기에 배우는 입장으로 긍정적인 부분만 보려고 노력 중입니다. 2. 리액트 booking system 프론트엔드 개발자로 참여중이고 곧 UI가 완성될 예정이라 오랜만에 리액트를 ..

1. UX research - Timeline (Research, Information, Interaction Design, UI Design, Iteration - User Interview - Empathy Map - Identify User Pain Points - Personas - User Journey Map - Problem Statement - Competitor Analysis - Affinity Diagram - Insights 2. Define & Ideation - Brainstorms (Workshops) - Meetings (Planning) - Diagramming (Research & Design) - Engineering 3. Information Architecture -..

When determining the theme color for UI/UX design, there are several factors to consider. The theme color will play a significant role in establishing the overall look and feel of the design, as well as conveying the desired emotions and enhancing usability. Here's a step-by-step guide to help you determine the theme color: 1. Understand the project and target audience Start by gaining a thoroug..

목표 최신 트렌드 파악하기 전반적인 이해력 향상시키기 디자인 감각 키우기 단어 공부 읽은 아티클 - Something Pretty Right: A History of Visual Basic https://retool.com/visual-basic/ Something Pretty Right: A History of Visual Basic | Retool How Visual Basic became the world’s most dominant programming environment, its sudden fall from grace, and why its influence is still shaping the future of software development. retool.com - Best UX P..

카트 넣은 아이템을 유저가 마지막 결제 단계 전 변심으로(혹은 다른 추가하고 싶은 상품이 있어서) 카트 페이지를 떠나면, 자동으로 쇼핑카트에 담긴 아이템들이 싹 비워지도록 만들어달라는 요청을 받았다. 쇼피파이 뿐만 아니라 아마존이나 다른 큰 이커머스 웹사이트를 참고하면 알 수 있듯이 카트에 든 상품은 심지어 다른 웹사이트를 둘러보고 와도 한동안은 남아있어야 하는 것이 구매 가능성을 높이는 데 도움이 되는데, 이 클라이언트는 user experience에 대한 이해가 부족하다. 내 개인 클라이언트는 아니고, 팀에서 받은 클라이언트라 내가 직접 대화하지는 못하지만 도움이 될까봐 쇼핑카트 UX 디자인에 대한 글을 찾아보다 그 이유를 잘 설명해주는 아티클을 발견했다. 해당 내용만 요약해서 전달해주고 싶었는데 이..

프로젝트 만들 때 마다 헷갈리지 않도록 2023년 기준으로 찾았어요. 1. @media only screen and (...) { } @media (min-width: 576px) { .container { max-width: 540px; } } @media (min-width: 768px) { .container { max-width: 720px; } } @media (min-width: 992px) { .container { max-width: 960px; } } @media (min-width: 1200px) { .container { max-width: 1140px; } } 2. Bootstrap 기준 // X-Small devices (portrait phones, less than 576px)..

Hiring managers are listening for a few key factors in your response: professionalism strong interpersonal skills and listening skills patience an approach that keeps the company's best interests in mind optimism and a positive outlook an ability to learn from tough experiences and recognize the key takeaways from a difficult situation Best answers show how you stay calm and professional focus o..