티스토리

archuive

검색하기

블로그 홈

archuive

archuive.tistory.com/m

www에서 인터페이스를 만드는 디자이너입니다✨

구독자: 3

방명록 방문하기

반응형

주요 글 목록

필터를 디자인할 때 고민해야할 UI 및 UX UXPin의 Filter UI and UX 101 – An In-Depth Guide 를 참고해 작성된 글입니다.필터는 사용자 인터페이스 디자인에서 강력한 도구로, 사용자 여정을 간소화하고 효율성과 콘텐츠 발견을 통해 사용자 참여를 높이는 데 기여합니다. 이 글에서는 UI 필터 디자인의 기본 원칙과 실무 사례를 통해 사용자 친화적인 필터 패턴을 설계하는 방법을 탐구합니다. 또한, 주요 기술 기업들의 예시를 통해 필터가 사용자 경험을 어떻게 향상시키는지 살펴봅니다.UI 필터란 무엇인가?UI 필터는 사용자가 특정 기준에 따라 데이터 집합이나 옵션을 좁히는 데 사용하는 디자인 요소입니다. 예를 들어, 전자상거래 사이트에서 사용자는 사이즈, 색상, 가격 등을 기준으로 제품을 검색할 수 있습니다. 필터 UI는 사.. 공감수 0 댓글수 1 2024. 7. 15.
바우하우스에서 배우는 협업과 창의성: 현대 UX 디자인에 적용하기 안녕하세요, 오늘은 바우하우스(Bauhaus) 운동에서 영감을 받아 협업을 통한 창의성을 찾는 방법에 대해 깊이 있게 탐구해보려고 합니다. 이 글은 Google Design의 Jens Riegelsberger가 Medium에 기고한 글을 번역한 것으로, 바우하우스 철학이 현대 UX 디자인에 어떻게 적용될 수 있는지 살펴보겠습니다. 바우하우스: 협업에서 창의적 영감을 찾다UX 디자인과 바우하우스 철학UX 디자인은 아직 초기 단계에 있으며, 종종 최근의 기술적 능력에 너무 집착하는 경향이 있습니다. 이는 장기적인 관점을 흐리게 할 수 있습니다. 이에 대한 해결책으로, 저는 한 세기 전으로 돌아가 바우하우스 초기 시절에서 영감을 찾는 것이 유용하다는 것을 알게 되었습니다.바우하우스는 장식적 요소를 비판적으로.. 공감수 1 댓글수 0 2024. 6. 30.
일론 머스크가 아이들에게 가르쳐야한다고 주장한 50가지 인지 편향 일론 머스크는 공학 및 혁신 분야에서 탁월한 성과를 이루며, 그 성공의 비결로 '기본 원칙 사고(first principles thinking)'를 강조합니다. 그는 최근 트위터를 통해 인지 편향을 어릴 때부터 가르쳐야 한다고 주장하며, 50가지 주요 인지 편향을 소개했습니다. 이 편향들은 우리가 일상생활과 업무에서 더 명확하고 논리적인 사고를 할 수 있도록 도와줍니다. 50가지 인지 편향 목록⭐️ 기본 귀인 오류 (Fundamental Attribution Error): 타인의 행동은 성격 때문이고, 자신의 행동은 상황 때문이라고 생각하는 경향.⭐️ 자기 중심 편향 (Self-Serving Bias): 성공은 자신의 능력 덕분이고 실패는 외부 요인 때문이라고 믿는 경향.내집단 편애 (In-Group F.. 공감수 1 댓글수 1 2024. 6. 27.
UI/UX 개선을 위해 점검할 7가지 마법 체크리스트 문제를 식별하고 웹/앱을 최적화하는 손쉬운 방법디지털 제품이 사용자 기대에 미치지 못하면, 사용자는 대안을 빠르게 찾기 시작합니다. 웹사이트가 멋지고 다양한 기능을 갖추고 있어도, 정작 사용자들이 원하는 기능이 어디에 있는지 찾지 못하면 무용지물입니다. 높은 전환율을 기대했지만 결과가 좋지 않은 이유는 무엇일까요?테스트를 시작하기 전에, "7가지 마법"을 통해 웹 또는 앱을 점검해 보세요. 이 효율적인 방법은 숨겨진 문제를 드러내어 마법처럼 작동합니다.그렇다면 "7가지 마법"이란 무엇일까요? 나른한 저녁 식사 시간에 손님들이 접시에 음식을 담고 있는 장면을 상상해보세요. 무엇이 문제일까요? 음식이 맛이 없어서? 서비스가 좋지 않아서? 손님들이 배가 고프지 않아서? 아니면 분위기가 너무 여유로워서?디지털 .. 공감수 2 댓글수 2 2024. 6. 26.
웹사이트 메뉴 디자인 체크리스트 : 17가지 UX 가이드라인으로 사용자 경험 향상하기 이 글은 닐슨 노먼 그룹(Nielsen Norman Group)의 아티클을 읽고 번역한 글입니다.원문은 🔗 이곳에서 확인 가능합니다. 사용자는 콘텐츠를 찾고 기능을 사용하기 위해 메뉴에 의존합니다. 이 체크리스트를 사용하여 메뉴가 제대로 작동하는지 확인하세요. 너무 자주, 우리는 혼란스럽거나 조작하기 어려운 메뉴로 인해 사용자가 어려움을 겪는 것을 목격합니다. 이 가이드라인을 따르면 사용자가 메뉴를 통해 쉽게 콘텐츠를 찾고 기능을 활용할 수 있게 됩니다.탐색 메뉴 가시성 확보1. 큰 화면에서는 탐색 메뉴 표시데스크탑 웹사이트와 앱에서는 햄버거 메뉴를 사용하지 않는 것이 좋습니다. 화면에 메뉴를 숨기지 말고, 충분한 공간이 있을 때는 메뉴를 명확히 표시하세요. 탐색은 단순히 경로를 안내하는 역할뿐만.. 공감수 1 댓글수 0 2024. 6. 21.
[PDF] 메뉴 디자인 체크리스트: 17가지 UX 가이드라인 메뉴는 웹사이트와 애플리케이션에서 사용자가 콘텐츠를 찾고 기능을 사용하는 데 중요한 역할을 합니다. 사용자가 쉽게 이해하고 조작할 수 있는 메뉴를 제공하는 것은 좋은 사용자 경험(UX)을 제공하는 데 필수적입니다. 효과적인 메뉴 디자인은 사용자가 사이트나 애플리케이션을 사용하는 데 있어 중요한 요소입니다. 체크리스트를 활용하여 메뉴를 점검하고 개선하면 사용자가 보다 쉽게 콘텐츠를 찾고 기능을 활용할 수 있게 됩니다. 이러한 가이드라인을 따르면 사용자 경험을 향상시켜보세요! 이 PDF 파일의 자세한 적용은 아래의 글에서 확인해보세요. 😎 웹사이트 메뉴 디자인 체크리스트 : 17가지 UX 가이드라인으로 사용자 경험 향상하기이 글은 닐슨 노먼 그룹(Nielsen Norman Group)의 아티클을.. 공감수 0 댓글수 0 2024. 6. 21.
[UX Writing의 비밀] 해요체와 합니다체를 완벽히 활용하는 방법 디지털 프로덕트를 만드는 UI/UX 디자이너 여러분께서는 사용자 경험을 최적화하기 위해 다양한 요소를 고려하셔야 하죠. 그 중에서도 UX Writing은 사용자와 인터페이스 간의 소통을 원활하게 하는 중요한 역할을 합니다. UX Writing에서 사용하는 문체는 사용자 경험에 큰 영향을 미치며, 적절한 문체를 선택함으로써 사용자에게 더 나은 경험을 제공할 수 있습니다. 이번 글에서는 해요체와 합니다체를 언제, 어떻게 사용하면 좋을지 예시를 통해 알아보겠습니다.🤓해요체의 사용해요체는 친근하고 부드러운 느낌을 줍니다. 사용자가 인터페이스와 상호작용할 때 편안함을 느낄 수 있도록 도와줍니다. 다음과 같은 상황에서 해요체를 사용하는 것이 적합합니다:온보딩 과정: 처음 앱을 사용하는 사용자에게 친근하게 다가가고.. 공감수 0 댓글수 0 2024. 6. 20.
북마크, 즐겨찾기, 핀, 별표의 디자인 차이점 프로덕트 디자이너로서 우리는 북마크, 즐겨찾기, 핀, 별표와 같은 용어를 자주 접합니다. 이 기능들은 간단해 보일 수 있지만, 구현 방식에 따라 사용자 경험(UX)에 큰 영향을 미칩니다. 이 글에서는 이러한 요소들을 접근하는 방법을 다루며, 모호성을 줄이고 사용자 만족도를 높이는 방법을 공유합니다.기본 개념 이해하기북마크(Bookmarks): URL이나 문서를 나중에 쉽게 접근할 수 있도록 저장하는 기능입니다. 주로 웹 브라우저에서 사용되며, 예를 들어 사용자가 중요한 정보를 빠르게 찾을 수 있도록 도와줍니다.즐겨찾기(Favourites): 사용자가 자주 사용하거나 선호하는 항목을 빠르게 접근할 수 있도록 표시하는 기능입니다. 예를 들어, 쇼핑몰 웹사이트에서 자주 구매하는 상품을 즐겨찾기에 추가할 수 있.. 공감수 0 댓글수 0 2024. 6. 19.
정보와 경험의 구분이 디자인 시스템의 성숙도에 기여하는 방법 디자인은 단순히 시각적인 요소를 아름답게 만드는 것 이상의 의미를 가지고 있습니다. 디자인의 핵심은 사용자 경험을 향상시키고, 정보 전달을 효율적으로 하는 데 있습니다. 이번 글에서는 정보와 경험의 구분이 디자인 시스템의 성숙도에 어떻게 기여할 수 있는지에 대해 논의해보겠습니다.정보와 경험의 차이정보는 우리가 전달하려는 사실, 데이터, 지식 등을 의미합니다. 반면 경험은 사용자가 정보와 상호작용하면서 느끼는 감정과 인식을 포함합니다. 예를 들어, 웹사이트의 콘텐츠는 정보이고, 그 웹사이트를 탐색하는 과정에서 사용자가 느끼는 것은 경험입니다.성숙한 디자인 시스템의 특징성숙한 디자인 시스템은 단순히 정보를 제공하는 것에 그치지 않고, 사용자의 경험을 고려합니다. 정보와 경험을 균형 있게 조화시켜야 합니다. .. 공감수 0 댓글수 0 2024. 6. 18.
디자이너는 화면의 흐름을 어떻게 표현할까? - 화면 흐름도, 정보 구조도, 유저 플로우로 알아보기 피그마에 화면을 나열하다보니 궁금한게 생겼다, 어디로 확장해야하지?UI/UX를 디자인 할 때 고민해야 할 화면의 진행 방향성에 대해 작업자들이 동의할 수 있는 레퍼런스가 있는지 궁금했다.그러다가 찾아보게된 화면 흐름도 (Screen Flow Diagrma), 정보 구조도 (Information Archtecture), 유저 플로우 (User Flow)! 화면 흐름도 (Screen Flow Diagram)유저가 서비스를 이용하는 흐름이나 기능을 정의하기 위해 만드는 문서이다.화면이나 기능 단위로 유저의 동선을 설계하게 되며, 화살표와 도형을 사용해 도표(Diagram)을 만든다.특징화살표를 따라가다보면 사용자가 어떤 프로세스로 서비스를 이용하는지 파악할 수 있다.각 도형의 의미가 명확해 작업자들이 설계할 .. 공감수 2 댓글수 1 2024. 3. 28.
닐슨 노먼그룹이 선정한 2022 UX 아티클 Top 10 2022년이 마무리되며닐슨 노먼 그룹에서 한 해 발행된 사용자 경험 아티클 중 가장 많은 청중을 모은 글 10가지를 공개했다.Data Tables: Four Major User Tasks테이블은 1)특정 기준에 맞는 레코드 찾기 2)데이터 비교 3)단일 행 데이터 보기/편집/추가 4)레코드에 대한 작업 수행과 같은 일반적인 유저 태스크 네가지를 지원해야한다.UX Strategy: Definition and ComponentsUX 전략은 솔루션을 설계하고 구현하기 전에 목표 달성 방향에 대한 이해를 공유하는 3단계 계획이다. 시간이 지남에 따라 UX 작업의 우선 순위 지정 및 실행을 안내하는 역할을 한다.Best Font for Online Reading: No Single Answer가독성 높은 폰트 중.. 공감수 0 댓글수 0 2022. 12. 27.
네이밍 컨벤션(명명규칙)의 힘 다음 글은 The power of naming convention 을 번역한 글입니다.우리는 모두 누군가(아마도 상사일 것입니다) 최신 이메일이나 게시판을 찾거나 얼마전에 만든 파일을 공유해 달라고 요청하면 찾기가 어려웠던 경험이 있었을 것이다.어디에 있지?어떻게 찾지?어떻게 다시 이름 붙이지?아마도 파일은 와 같이 이름 붙어 있을것이며, 특별히 이 파일을 작업하지 않은 사람에게는 의미가 없는 이름입니다.이와 같은 상황은 드물지 않습니다. 사람들이 다양한 비즈니스 상황에서 자산을 찾는 데 어려움을 겪는 연구를 관찰한 후 어떤 기술이 이 패러다임을 바꿀 수 있는지 궁금했습니다.즉, 상속된 명명 규칙이나 구조 내에서 어떻게 탐색 할 것인가?원하는 결과에 도달하기 위해 다른 방법을 적용할 수 있는가?검색이.. 공감수 0 댓글수 0 2022. 12. 14.

반응형

문의안내

티스토리
로그인
고객센터

티스토리는 카카오에서 사랑을 담아 만듭니다.