brunch

라이킷 21 댓글

You can make anything
by writing

C.S.Lewis

계정을 잊어버리셨나요?

by 김예린 Apr 09. 2024

UI/UX 디자이너가 꼭 방문해야 할 20개 웹사이트

연금술사처럼 자료를 탐구해보세요.

다음 아티클을 번역한 글입니다.

UI/UX 능력을 개선하는 것은 지속적인 과정이며, 올바른 자료(materials)를 사용할 수 있으면 작업에 큰 영향을 미칠 수 있습니다. 이번 스토리에서는 UI/UX 디자이너들이 북마크해야 할 필수 웹사이트를 추천해 드리겠습니다. 창의적인 영감부터 대규모 아이콘 및 일러스트레이션 라이브러리에 이르기까지 이러한 리소스는 여러분의 재능을 발전시키는 데 필요한 도구를 제공합니다. 디자인 프로세스를 개선하고 싶거나 최신 트렌드를 알고 싶다면 이 목록에 모두를 위한 정보가 있습니다.

1. 모빈(Mobbin)

모빈

모빈은 검색 가능한 100,000개 이상의 모바일 및 웹 스크린샷 라이브러리를 제공하는 웹사이트로, 이를 통해 UI/UX 디자이너의 리서치 작업 시간을 절약할 수 있습니다. 이 리소스를 사용하면 영감을 얻고 모바일 및 웹 디자인 산업의 최신 트렌드를 파악할 수 있습니다.

2. 굿 UI(Good UI)

굿 UI는 아마존, 넷플릭스, 에어비앤비, 엣시, 구글, 부킹닷컴 등 최고의 기업이 수행한 A/B 테스트에서 얻은 통찰력을 UI/UX 디자이너에게 제공하는 웹사이트입니다. 이는 UI 디자인에서 무엇이 효과가 있고 무엇이 효과가 없는지에 대한 실제 사례를 통해 학습할 수 있는 훌륭한 리소스이며, 가장 최근에 밝혀진 UI 트렌드와 유출된 시험판에 대한 최신 정보를 제공합니다.

3. 아이콘파인더(Iconfinder)

아이콘파인더는 디자이너가 창의적인 프로젝트에 사용할 수 있는 다양한 이미지, 아이콘 및 사진을 제공하는 웹사이트입니다. 여기에는 독립적인 아티스트가 만든 수백만 개의 고품질 벡터 아이콘이 포함되어 있어, 사용자가 자신의 프로젝트에 이상적인 디자인 구성 요소를 신속하게 찾아 적용할 수 있어 창작 과정의 속도가 빨라집니다. 이 리소스에는 모든 디자인 요구 사항을 충족할 수 있는 다양한 시각적 요소가 있습니다.

4. 프리픽(Freepik)

프리픽은 다양한 창의적인 자료를 제공하는 웹사이트입니다. 수백만 개의 벡터, 사진, PSD 파일, 아이콘, 프레젠테이션 테마 및 사용자 맞춤화 가능한 템플릿을 모두 한 곳에서 사용할 수 있습니다. 디자이너, 개발자, 마케터가 제약 없이 매력적인 디자인을 만들 수 있는 다양한 대안을 제공하여 이상적인 프로젝트를 구축할 수 있도록 해줍니다.

5. 글레이즈스톡(Glazestock)

글레이즈스톡은 다양한 목적을 위해 로열티 프리 그래픽 라이브러리를 큐레이션 하는 웹사이트입니다. 이 컬렉션에는 제품, 브랜딩 및 프레젠테이션 애플리케이션용 그래픽이 포함되어 있습니다. 글레이즈스톡의 그래픽을 사용하여 독특하고 전문적인 스타일을 부여하여 프로젝트를 개선할 수 있습니다. 무료로 사용할 수 있으므로 예산에 민감한 디자이너에게 훌륭한 대안이 됩니다.

6. 스크린레인(Screenlane)

스크린레인은 최신 모바일 UI 디자인 아이디어에 대한 무료 주간 업데이트를 귀하의 사서함으로 직접 전송해 주는 웹사이트입니다. 엄선된 UI 디자인 패턴과 예시를 통해 이 리소스는 모바일 플랫폼의 최신 디자인 트렌드와 영감을 최신 상태로 유지하는 데 도움이 되며 이 분야에 관심이 있는 29,458명 이상의 디자이너 및 제품 담당자와 함께할 수 있습니다.

7. 어워즈(AWWWARDS)

어워즈는 세계 최고의 온라인 디자이너, 개발자 및 에이전시의 기술과 노고를 인정하고 보상하는 웹사이트입니다. 온라인 디자인 전문가들이 영감을 얻고 지식(knowledge)과 전문 지식(expertise)을 교환하며 동료들과 교류하고 건설적인 비판을 받는 모임의 장소입니다. '항상 질문하고' '항상 발전하는' 접근 방식을 통해 디자이너와 회사가 자신의 작업을 전시하고 업계 인정을 받을 수 있는 유용한 플랫폼을 제공합니다.

8. 테마아일(Themeisle)

테마아일은 랜딩 페이지, 애플리케이션, 프레젠테이션 등 다양한 프로젝트에 사용할 수 있는 고품질 그래픽 라이브러리를 제공하는 웹사이트입니다. 사용자는 표시된 컨셉을 개인화하고 이를 활용하여 작업을 구별할 수 있습니다. 사진은 PNG 및 SVG 형식으로 액세스 할 수 있으므로 다양한 응용 프로그램에 적합하고 프로젝트에 이상적인 일러스트레이션을 선택할 수 있습니다.

9.UI 가이드라인(UI Guideline)

UI 가이드라인 웹사이트에서는 39가지 주요 레퍼런스 시스템을 기반으로 UI 컴포넌트의 디자인 및 코딩을 표준화하기 위한 철저한 가이드인 UI 컴포넌트 핸드북(UI Components Handbook)을 제공합니다. 이는 UI 컴포넌트를 생성하기 위한 일관되고 명확한 단일 프레임워크를 제공하므로 여러 프로젝트에서 디자인 및 코드 일관성을 유지하려는 UI/UX 디자이너와 개발자에게 중요한 리소스가 됩니다.

10. 더나운프로젝트(The noun project)

더나운프로젝트는 세계에서 가장 다양하고 규모가 큰 아이콘 모음을 제공하는 웹사이트입니다. 아이콘은 120개국 이상의 디자이너 커뮤니티에 의해 만들어졌으며 AI, UI 컴포넌트를 포함한 다양한 테마를 다룹니다. 이 웹사이트에는 보다 포용적인 사회를 대표하고 다양성을 기리는 목표를 가지고 전 세계 사진가 커뮤니티가 선택한 고품질 사진 갤러리도 포함되어 있습니다.

11. 폰트어썸(Font Awesome)

폰트 어썸은 웹 디자인에 사용할 수 있는 다양한 아이콘과 도구를 제공하는 잘 알려진 웹사이트입니다. 모든 웹 사이트에 쉽게 통합할 수 있는 6,000개 이상의 아이콘 모음을 제공하므로 전문가 수준의 이미지를 간단히 추가하고 전반적인 디자인을 개선할 수 있습니다. 또한 다양한 스타일 선택이 가능하고 CSS 및 웹 폰트와 함께 사용할 수 있으며 여러 주요 웹 개발 프레임워크와 호환됩니다.

12. UI 페이스(UI faces)

UI 페이스는 디자인 목업에 사용할 수 있는 아바타 라이브러리를 제공하는 웹사이트입니다. 다양한 무료 소스에서 아바타를 수집하고 사용자가 복사-붙여 넣기, API 또는 스케치, 어도비 XD, 피그마와 같은 인기 디자인 애플리케이션용 플러그인을 통해 아바타를 쉽게 찾아 디자인에 포함할 수 있도록 해줍니다. 아바타는 자주 업데이트되므로 디자인 목업을 위한 다양하고 신선한 사진 모음을 발견할 수 있는 훌륭한 장소입니다.

13. 유즈애니메이션(UseAnimations)

유즈애니메이션은 앱이나 웹사이트에서 사용할 수 있는 애니메이션 아이콘 모음을 제공하는 마이크로 애니메이션 라이브러리입니다. 아이콘은 앱이나 웹사이트의 스타일과 느낌에 맞게 쉽게 조정할 수 있는 부드럽고 가벼운 애니메이션을 가능하게 하는 Lottie Framework로 생성됩니다. useAnimations를 사용하면 처음부터 애니메이션을 생성할 필요 없이 전문가 수준의 애니메이션을 디자인에 쉽게 추가할 수 있으므로 디자이너와 개발자의 시간과 리소스가 절약됩니다.

14. 로디콘(Lordicon)

로디콘은 8,900개 이상의 아이콘이 포함된 대규모 애니메이션 아이콘 라이브러리입니다. 디지털 상품, 프레젠테이션, 영화 등에 활용할 수 있는 6가지 다양한 디자인의 수많은 아이콘을 제공합니다. 총 1,494개의 무료 아이콘과 7,466개의 프리미엄 아이콘이 있습니다. 역동적이고 매력적인 애니메이션을 작업에 통합하려는 디자이너와 개발자를 위한 훌륭한 리소스입니다. 아이콘은 꼼꼼하게 제작되어 다양한 형식(svg, json, gif, png 등)으로 제공되므로 웹 및 그래픽 디자인의 다양한 영역에서 더욱 유용하게 사용할 수 있습니다.

15. Ls. 그래픽(Ls.graphics)

Ls. 그래픽은 온라인 및 그래픽 디자인을 위한 전문적인 디자인 도구를 제공하는 웹사이트입니다. 배경, 일러스트레이션, 3D 일러스트레이션, 디바이스 목업, 브랜딩 목업, 애니메이션 목업 등을 이용할 수 있습니다. 이러한 도구는 전반적인 디자인을 개선하고 미학적으로 더욱 매력적으로 만드는 데 사용될 수 있습니다. 처음부터 새로 만들지 않고도 작업에 고품질의 전문적인 면을 추가하려는 디자이너와 개발자에게 이상적입니다. 이 웹사이트는 디자인 작업의 여러 영역에 도움이 되는 스타일, 디자인, 형식 측면에서 다양한 대안을 제공합니다.

16. 스크리블(Skribbl)

스크리블은 디자인 프로젝트에 사용할 손그림 일러스트레이션을 판매하는 웹사이트입니다. 모든 디자인 작업에 개인적인 느낌을 더하는 데 활용할 수 있는 다양한 무료 전문 일러스트레이션을 제공합니다. 이러한 그림은 전 세계 예술가 커뮤니티에서 제작되었으며, 모든 디자인 프로젝트의 시각적 매력을 향상해 더욱 독특하고 매력적으로 만드는 데 활용할 수 있는 다양한 스타일, 주제 및 디자인을 제공합니다. 스크리블을 사용하면 프로젝트를 돋보이게 하는 데 도움이 되는 고품질의 독특한 그래픽을 쉽게 찾을 수 있습니다.

17. 언드로우(Undraw)

언드로우는 창의적인 프로젝트에 사용할 수 있는 일러스트레이션 라이브러리를 제공하는 웹사이트입니다. 모든 디자인 작업의 시각적 매력을 향상하는 데 활용할 수 있는 다양한 주제, 스타일 및 사진이 포함된 다양한 이미지 컬렉션을 제공합니다. 사진은 간단하게 검색이 가능해 필요에 가장 적합한 이미지를 빠르게 찾을 수 있으며, 브랜드 아이덴티티에 맞게 일러스트의 색상을 조정할 수 있는 기능도 있습니다. 이는 추가 디자인 작업 없이 즉시 수행할 수 있습니다.

18. 벡티지(Vecteezy)

벡티지는 창의적인 프로젝트에 사용할 수 있는 대규모 벡터 라이브러리를 제공하는 웹사이트입니다. 여기에는 다양한 창의적인 프로젝트에 활용할 수 있는 엄선된 최신 벡터 파일이 650,000개 이상 포함되어 있으며 정기적으로 업데이트됩니다. 웹사이트의 벡터는 고품질로 선정되어 있어 프로젝트에 활용할 전문적이고 독특한 요소를 찾는 디자이너에게 훌륭한 리소스가 됩니다. 또한 웹사이트에는 다양한 종류의 벡터를 탐색할 수 있는 기능이 있어 프로젝트에 대한 영감과 적절한 벡터를 더 쉽게 찾을 수 있습니다.

19. 플래티콘(Flaticon)

플래티콘은 창의적인 프로젝트에 사용할 수 있는 다양한 벡터 아이콘과 스티커를 제공하는 웹사이트입니다. 900만 개 이상의 에셋을 사용할 수 있는 가장 큰 아이콘 및 스티커 라이브러리 중 하나를 보유하고 있습니다. 아이콘과 스티커는 웹사이트, 앱, 프레젠테이션 등 다양한 애플리케이션에 사용될 수 있습니다. 라이브러리는 정기적으로 업데이트되므로 항상 새롭고 신선한 자료에 액세스 할 수 있습니다. PNG, SVG, EPS, PSD, CSS 등 다양한 형식의 아이콘과 스티커를 다운로드할 수 있어 모든 프로젝트에 쉽게 포함할 수 있습니다. 또한 모든 작업에 적합한 다양한 디자인, 스타일 및 분류 선택이 가능합니다.

20. 사이트인스파이어(Siteinspire)

사이트인스파이어는 온라인 및 인터랙티브 디자인의 최고 사례 모음을 큐레이션 하는 웹사이트입니다. 이는 디자이너, 개발자 및 기타 창의적인 전문가를 위한 리소스 역할을 합니다. 이 웹사이트는 여러 섹터의 다양한 프로젝트를 선보이며, 각 프로젝트는 온라인 및 인터랙션 디자인의 최신 동향과 방법을 보여줍니다. 사이트인스파이어는 최신 디자인 트렌드와 접근법에 대한 최신 정보를 얻고 자신의 프로젝트에 대한 영감을 얻고자 하는 디자이너를 위한 환상적인 리소스입니다.

마지막으로, UI/UX 디자이너로서 자신의 능력을 향상하고 최신 트렌드와 방법론을 최신 상태로 유지하려면 올바른 리소스를 확보하는 것이 중요합니다. 디자인 영감부터 아이콘 및 일러스트레이션 라이브러리까지, 이 아티클에 언급된 웹사이트는 작업을 한 단계 더 발전시키는 데 도움이 되는 다양한 도구와 리소스를 제공합니다. 이러한 자료는 디자인 프로세스를 개선하고 싶거나, 디자인 트렌드를 최신 상태로 유지하거나, 다음 프로젝트에 대한 영감을 얻고자 하는 모든 UI/UX 디자이너에게 유용할 것으로 보장됩니다. 지속적으로 영감을 얻고 교육을 받으려면 이러한 사이트를 북마크에 추가하고 정기적으로 방문하는 것이 좋습니다.