728x90 UI UX Design/참고 사이트8 UI디자인 해상도 정의에 도움이 되는 사이트 - 스탯 카운터 어떤 기준으로 해상도를 정하지? 디자인에 앞서 모바일이든 웹이든 해상도를 정해야 디자인을 시작할 수 있습니다. 평균적으로 많이 쓰는 디바이스의 해상도를 토대로 기준을 잡거나 선행하여 디자인된 화면을 참고하여 기준을 잡기도 하죠. 경우에 따라서는 해상도를 기준을 직접 정하는 것이 애매하거나 부담스러운 경우도 종종 있습니다. 스탯 카운터는 기준을 잡을 수 있도록 전 세계 트래픽 데이터를 제공합니다 스탯 카운터 - 웹 트래픽 분석 사이트 스탯 카운터는 전 세계의 웹 브라우저 점유율부터 OS점유율, 디바이스 점유율, 모바일과 데스크탑 해상도 등 여러 가지 정보를 열람해 볼 수 있는 사이트입니다. 기간이나 국가, 디바이스별로 필터링해 볼 수 있어 IT관련하여 굉장히 유용한 사이트입니다. Statcounter Gl.. 2023. 2. 9. 디자인 시스템 실제 사례 관련 사이트 모음 Design System 디자인 시스템이란 디자인 시스템은 다양한 제품에서 일관된 경험을 생성하는 데 사용하는 명확한 표준에 따라 재사용 가능한 기능 요소(구성 요소 및 패턴)의 모음입니다. 디자인 시스템은 디지털 제품 디자인 및 응용 프로그램이나 웹 사이트와 같은 제품 개발을 지원합니다. 여기에는 패턴 라이브러리, 디자인 언어 , 스타일 가이드, 코딩된 구성 요소, 브랜드 언어 및 문서가 포함될 수 있지만 이에 국한되지 않습니다. 관련된 다양한 팀(예: 디자이너, 개발자, 카피라이터 및 프로젝트 관리자)이 디지털 제품을 설계하고 구축하는데 도움이 되는 역할을 합니다. 디자인 시스템의 장점 중 일부는 다음과 같습니다. 재사용 가능한 구성 요소와 공유된 근거를 통해 더 빠르게 빌드 보다 일관된 사용자 경험과 일관된 디자인 언어를 .. 2022. 12. 13. 웹 접근성 Web Accessibility 관련 사이트 모음 정의 W3C 접근성 원칙 https://www.w3.org/WAI/fundamentals/accessibility-principles/ko 네이버 접근성 가이드 https://accessibility.naver.com/accessibility 웹 접근성(Web Accessibility) 4대 원칙 https://365kim.tistory.com/71 웹의 평등성을 위한 웹 접근성 https://brunch.co.kr/@remain/10 컬러 모바일 UI 디자인 기본 요소 - 색채 Color https://brunch.co.kr/@chulhochoiucj0/17 WCAG 표준 팔레트 Color Review https://color.review/ 개선사례 온라인 쇼핑몰 웹 접근성 개선하기 2 - 청각 htt.. 2022. 12. 12. UI UX 디자인 레퍼런스 사이트 7곳 반갑습니다. 현직 UI디자이너 들댕댕입니다. 디자이너는 매 순간 크리에이티브와 싸워야 하죠. 무기가 되기도 재산이 되기도 하는 것이 레퍼런스입니다. 실제로 제가 레퍼런스를 찾을 때, 트렌드를 살필 때 탐색하는 사이트 7가지입니다. 여러분도 아래 사이트에서 분명 디자인 영감을 얻을 수 있을 것입니다. 1. Pinterest 스크랩하고자 하는 이미지를 포스팅하고 다른 이용자와 공유하는 소셜 네트워크 서비스 디자이너라면 모두 이용하고 있을 도구 중 하나입니다. 사용자는 주제에 맞는 핀 보드를 만들고 거기에 이미지를 아카이빙 합니다. UI UX 디자인은 물론 제품, 패션, 인테리어 등 여러 주제의 다양한 이미지들이 개제 되어있어 각 주제의 트렌드를 알아볼 수 있고, 내 취향에 맞는 이미지를 아카이빙하며 잠자던 .. 2022. 12. 7. UI UX 디자인 인사이트 사이트 5곳 UI 디자이너는 사용자가 서비스를 원활히 작동할 수 있도록 시각적인 화면 구성력이 있어야 합니다. 거기에 더하여 마냥 이쁘게만 하는 디자인이 아닌 보다 본질적이고 🤔사용자 경험에 충실한 사고가 뒷받침되어야 한다고 생각합니다. 많은 전문가들에 의해 선행된 UX에 관한 고찰, 아이디어들을 찾아보면 금방 나오는데요, 제가 사용자 경험을 고려할 때 참고하고 UX 트렌드를 살필 때 탐색하는 사이트 5곳입니다. 여러분도 아래 사이트에서 인사이트를 얻길 바랍니다. 1. 서핏 다양한 채널에서 생산된 전문가들의 콘텐츠를 간편하게 맞춤 제공하는 커리어 지식 플랫폼 디자이너들에게 유용한 아티클이나 비주얼 레퍼런스, 디자인 리소스를 한 곳에 모두 큐레이션 해놓아 인터넷 이곳저곳을 찾아다닐 필요 없이 매일 추천 콘텐츠를 받아 .. 2022. 12. 7. UI디자이너의 실무 디자인 툴 3가지 - 피그마 프로토파이 제플린 반갑습니다. 현직 UI디자이너로 일하고 있는 들댕댕입니다. UI와 UX의 정의는 명확히 나눌 수 있지만 실무에서 이 둘을 명확히 나눠 프로젝트를 진행할까요? 실제 서비스를 디자인할 때 UX를 충분히 고려해야 사용성 좋은 UI가 나옵니다. 어떨 때 디자이너는 기획자보다 더 기획자스럽게 파고들어야 빈틈없는 UX와 그에 알맞은 UI를 만들어 낼 수 있습니다. 현재 제가 실무에서 사용하고 있는 툴은 크게 세 가지입니다. 피그마 UI 디자인 프로토파이 프로토 타입 제플린 디자인 가이드 그리고 필요하면 추가적으로 어도비 일러스트레이터나 포토샵을 쓰기도 합니다. 참고로 UI디자인 툴은 스케치를 써오다가 작년부터 피그마로 넘어왔습니다. 그럼 각 툴의 자세한 내용을 정리해보겠습니다. 1. 피그마 디자인, 프로토 타이핑 .. 2021. 2. 26. 앱 디자인 패턴 사이트 mobbin 디자인을 시작하기 전 기준이 될 기기를 선정하고 그에 맞는 해상도로 작업을 진행합니다. 아이폰 X 출시 이후 iOS 기기를 디자인할 때에는 하단 홈버튼과 상단 노치 영역을 고려해야 하는데요 최신 iOS 앱 패턴을 모아놓은 사이트가 있어 소개합니다. Mobbin Mobbin은 최신 iOS 앱 디자인 패턴 모음입니다. 150개 이상의 앱과 8,000개 이상의 패턴이 게재되어있습니다. 서비스들은 계속 최신 버전으로 업데이트 관리되고 있습니다 필터 및 검색을 통해 방대한 양의 페이지들을 원하는 조건에 맞추어 바로 소팅해볼 수 있고 마음에 드는 패턴은 자신의 라이브러리에 저장할 수도 있습니다 세 가지의 필터링 장치가 있는데요. 앱의 성격 ex) 파이낸스, 소셜 네트워킹, 뉴스 등 페이지의 종류 ex) 로그인, 지.. 2021. 2. 25. 앱 스토어 스크린샷 패턴 사이트 scrnshts App Store 스크린 샷은 사용자가 보게 될 첫 번째 마케팅 자산입니다. 사용자가 스토어 등록 정보를 살펴보고 앱을 다운로드할지 여부를 결정하는 데 평균 7초가 걸립니다. 사실 대다수의 사람들이 더 빨리 페이지를 떠나지만 대게는 다음과 같은 프로세스를 따릅니다. 아이콘을 확인하고 처음 두 개의 스크린 샷을 보고 앱 설명의 첫 번째 줄을 스캔합니다. 그만큼 스크린샷의 시각적인 설득이 중요한데요, 앱 스크린샷만 모아놓은 사이트를 소개합니다. scrnshts 앱스토어 스크린샷을 모아놓은 사이트로 디자인 트렌드를 살펴볼 수 있는 사이트입니다. 본 사이트 제작자는 mobbin.design 에서 영감을 받아 제작했다고 합니다. 왼쪽 사이드바에서 카테고리를 소팅할 수 있습니다 정직한 컷으로 기능 설명에 초점을 맞.. 2021. 2. 22. 이전 1 다음 728x90 반응형
