–
오늘 소개할 서비스는 ‘다크모드’와 연관이 있습니다. 다크모드에 맞게 디자인된 다양한 웹사이트를 한 곳에서 확인할 수 있는 공간이기 때문입니다. 이런 유형의 서비스가 지닌 공통의 장점은 우리가 직접 시간을 들여 찾아야 하는 대상을 보기 좋게 정리해준다는 것으로, 15년 경력의 프로덕트 디자이너가 직접 운영하고 있습니다.
페이지 구성은 아주 간단합니다. 다크모드로 구성된 웹사이트를 리스트 형태로 확인할 수 있으며, 특정 대상을 클릭하면 실제 웹사이트로 이동해 자세한 내용을 살펴볼 수 있습니다. 리스트는 다크모드가 적용된 웹사이트 대표 이미지와 그곳의 이름으로 채워져 있고요.
지금 써보러 갑니다를 통해 영감을 주는 웹사이트(웹디자인) 큐레이션 서비스를 여럿 소개한 적 있는데 이렇게 다크모드만 모아볼 수 있는 공간은 처음인 것 같습니다. 다크모드를 기본으로 하는 공간도 있지만, 페이지 내 직접 설정해야 확인할 수 있는 곳도 많아 이렇게 모여있는 것만으로도 많은 도움이 된다고 생각합니다.
이곳에 등록된 웹사이트는 모두 실제 존재하는 곳으로, 다크모드가 어떻게 적용되어 있는지 살펴보는 것도 좋지만 웹디자인의 관점에서 무엇을 참고할 수 있는지 들여다볼 수 있다는 점도 매력적입니다. 기존의 웹디자인 큐레이션 서비스에 다크모드가 추가된 모습에 가깝기 때문입니다.
리스트에서 특정 웹사이트를 클릭하면 위와 같이 실제 구성 모습을 살펴볼 수 있습니다. 다크모드는 컨셉 디자인 자료도 꽤 많은데, 실제 구성된 모습을 자세히 볼 수 있어 더 많은 도움을 받을 수 있습니다.
다크모드가 적용된 웹사이트가 정말 많아, 이곳 하나만 잘 활용해도 레퍼런스 목적으로는 충분히 유용하게 사용할 수 있지 않을까 싶습니다. 운영하는 디자이너의 감각이 워낙 좋아, 보는 즐거움도 있고요. 다크모드가 적용된 실제 웹사이트, 웹디자인 레퍼런스 확인이 필요한 상황이라면 꼭 살펴보셨으면 합니다. 더 자세한 내용은 ‘링크’를 참고해주세요!
- 다크모드 구성, 어떻게 하면 좋을까?
- 웹 접근성에 대한 다양한 가이드와 사례를 제공해주는 곳 : Access Guide
- 348개 컴포넌트, 다크/라이트 모드 화면 각 36개를 피그마 내 무료로 활용할 수 있는 : Nucleus UI
–
