프로덕트

아직 프로덕트가 없습니다.

아티클

전체 보기
에드스튜디오

에드스튜디오

UX는 ‘누구나 할 수 있게’ 만드는 게 아니라 ‘실수해도 괜찮게’ 만드는 일이다

Frame 31.png

완벽한 사용자는 없어. 누구나 실수할 수 있고, 생각대로 안 될 수도 있어.

그래서 UX는 실수 자체를 막는 게 아니라,

실수해도 괜찮게 설계하는 게 핵심이야.

실무에서 꼭 필요한 예시

– 입력 실수 시 자동 포맷팅 (ex. 전화번호, 카드번호 등)

– 삭제 버튼 누르면 바로 삭제 → 되돌리기(Undo) 기능 제공

– 회원가입 중 뒤로 가도 입력 내용 유지

– 에러 메시지는 “뭐가 잘못됐는지 + 어떻게 해결할 수 있는지”까지 설명

디자인이 사용자에게 관용을 베풀수록, 그 경험은 더 친절하고 매끄럽게 느껴져.

UX는 ‘잘 쓰는 사람’을 위한 게 아니라, ‘실수한 사람’도 배려하는 기술이야.

2
0
에드스튜디오

에드스튜디오

클릭보다 ‘머뭇거림’을 설계하라

많은 디자이너가 클릭을 유도하는 데 집중해.

하지만 진짜 중요한 건 “왜 클릭하지 않았는지”를 먼저 파악하는 거야.

사용자가 버튼 앞에서 머뭇거리는 이유는 다양해.

  • 지금 클릭하면 무슨 일이 벌어지는지 몰라서

  • 아직 결정이 안 나서

  • 뭔가 찜찜해서

이럴 땐 클릭을 유도하기 전에 머뭇거림을 줄이는 설계가 먼저야.

실무에서 자주 쓰는 방법

  • “왜 이걸 눌러야 하는지” 간단하게 설명 추가

  • CTA 주변에 신뢰를 주는 정보 배치 (리뷰, 수치 등)

  • 버튼 안 텍스트도 행동 + 보상 형태로 쓰기 (“3초 만에 시작하기” 등)

클릭은 결과야. 머뭇거림을 줄여야 클릭은 자연스럽게 따라와.

1
0
에드스튜디오

에드스튜디오

[유저는 모든 콘텐츠를 읽지 않는다. 유저를 읽게 하려면?]

유저는 모든 콘텐츠를 읽지 않는다. 유저를 읽게 하려면_.png

사용자는 페이지를 ‘정독’하지 않아. 훑어보고, 눈에 띄는 것만 클릭해.

그렇기 때문에 ‘잘 쓴 글’보다 ‘잘 보여지는 글’을 먼저 만들어야 해.

  • 첫 줄은 결론부터 → “왜 봐야 하는지”를 먼저 알려줘

  • 1문단 2~3줄 넘기지 말기

  • 리스트화 / 강조 텍스트로 시각적 리듬 만들기

  • 모바일 기준으로 테스트하기

  • 시선이 멈추는 포인트에 이미지나 아이콘 배치

중요한 건 ‘정보’보다 그 정보를 어떻게 보여주느냐야.

더 많은 UIUX 디자인 아티클을 읽고 싶다면?

https://blog.naver.com/edstudio-agency

에드스튜디오 블로그에서!

1
0
에드스튜디오

에드스튜디오

요즘 디자이너들은 왜 Pretendard를 좋아할까?

프리탠다드.png

요즘 서비스 디자인 보면 고딕 계열 중에서도

유독 Pretendard를 많이 쓰는 걸 볼 수 있어.

그 이유는 단순히 “예쁘니까”가 아니야.

디자이너들이 Pretendard를 고르는 이유

1️⃣ 시스템 폰트와 유사한 구조
→ Noto Sans나 Apple San Francisco와 비슷해서 iOS/안드로이드 양쪽에서 자연스럽게 어울려.

2️⃣ 라인 높이(line-height)가 안정적
→ 줄 간격 튐 없이, 리스트/카드 UI에도 깔끔하게 잘 맞음

3️⃣ 레벨 구분이 쉬움
→ 굵기(Weight) 단계가 다양해서 타이틀, 본문, 캡션까지 명확한 위계 설정이 가능해.

4️⃣ 웹에서도 렌더링 안정성 높음
→ 크로스 브라우저에서도 흐트러지지 않음. (디자이너+퍼블리셔 모두가 좋아함)

Pretendard는 ‘유행’이라기보다 실무에서 가장 덜 트러블 나는 선택지야.

더 많은 UIUX 디자인 아티클을 읽고 싶다면?

https://blog.naver.com/edstudio-agency

에드스튜디오 블로그에서!

2
0
에드스튜디오

에드스튜디오

[사람의 눈으로만 가능한 시각적 균형에 대해]

사람의 눈으로만 가능한 시각적 균형에 대해.png

디자인은 그리드, 픽셀, 수치로 맞췄다고 끝이 아니야.

정확한 정렬보다 중요한 건

사용자의 눈에 ‘편안하게 보이는 것’이야.

예를 들어

  • 원형 아이콘은 수치상 가운데 정렬돼도 시각적으로 아래로 쳐져 보이는 경우가 있어.

  • 텍스트와 아이콘 간 여백이 같아도 무게감에 따라 달라 보일 수 있어.

그래서 실무에선 이런 걸 “옵티컬 밸런스(Optical Balance)”라고 불러.

눈으로 조절하는 미세한 여백과 위치 보정이 필요하다는 뜻이야.

완벽한 숫자보다,

사람 눈이 자연스럽다고 느끼는 정렬이 더 강력해.

디자인 툴이 알려주지 않는 그 1~2px,

그게 진짜 실력에서 나오는 감각이야.

더 많은 UIUX 디자인 아티클을 읽고 싶다면?

https://blog.naver.com/edstudio-agency

에드스튜디오 블로그에서!

1
0

포스트

전체 보기
에드스튜디오

에드스튜디오

[디자인 시스템은 ‘자유’가 아니라 ‘일관된 기준’]

실무에서 디자인 시스템의 중요성을 알고

제대로 사용할 줄 아는 디자이너인지에 따라

이 사람이 프로인지 아닌지 알 수 있다고 생각해

디자인 시스템이 없으면 빠르고 뭔가 더 자유롭게 만들 수 있을 거라 생각하기 쉽지만

디자인 시스템은 빠르고 일관되게, 공동으로 작업해야하는 실무에서는

‘어떻게 만들어야 할지’ 매번 고민하지 않도록 도와주는 일관된 기준이자 공통의 언어야.

버튼, 폰트, 여백, 인터랙션처럼 기본 요소가 정리돼 있으면

새로운 화면도 빠르고 안정적으로 만들 수 있어.

혼자 작업할 땐 큰 차이를 못 느낄 수도 있지만, 팀으로 작업하면 이야기가 달라져.

디자이너 3명만 참여해도 디자인 시스템이 없으면 스타일이 제각각인 화면이 나오게 돼.

디자인 시스템은 창의력을 제한하는 게 아니라, 창의력을 더 ‘전달력 있게’ 분배하는 도구야.

2
0
에드스튜디오

에드스튜디오

[터치 영역은 생각보다 커야 한다]

터치 영역을 설정하는 디자이너가 프로와 아마추어의 차이라고 생각해

신입 디자이너들이나 학생들 강의를 하다보면

눈에 보이는것만 디자인이라고 생각하는 경우가 많더라고

디자인은 예쁜데, 버튼이 너무 작거나 간격 없이 붙어 있다면 사용자는 자꾸 실수해.

특히 모바일에선 마우스 커서가 아니라 ‘손가락’으로 조작하기 때문에

정확도가 훨씬 떨어질 수밖에 없어.

그래서 애플과 구글 모두

터치 영역은 최소 48px,아이콘의 크기는 24px로 설정해야

화면을 터치했을 때 오류가 덜 생기거든

생각보다 터치 영역이 클 수 있어 눈에 보이는 버튼만 키우는 게 아니라,

‘터치 가능한 범위’를 키우는 게 핵심이야.

오늘 만든 버튼, 보기에는 괜찮은데 누르긴 불편하지 않나?

사용자의 손가락부터 먼저 떠올려보자!

2
0
에드스튜디오

에드스튜디오

[폼 디자인은 사용자 인내심과의 싸움]


회원가입, 신청서, 결제폼 입력창이 많을수록 사용자는 점점 지쳐가.

특히 한 화면에 너무 많은 필드를 보여주면 중간에 포기할 확률도 높아져.

그래서 좋은 폼은 중요한 정보만 우선 보여주고

여러 단계를 나눠서 부담을 줄여줘.

진행률을 보여주는 프로그레스바나 입력 완료 시 피드백도 작은 디테일이지만 효과는 커.

오늘 만든 폼, 한 번에 다 채워야 하는 구조라면 사용자 인내심도 함께 테스트 중일지 몰라!

2
0
에드스튜디오

에드스튜디오

[고객의 말대로 만들지 말고, 고객의 목표대로 만들어라]

클라이언트가 “버튼을 크게 해주세요”라고 말했을 때, 정말 ‘크기’가 문제일까?

이럴 땐 말 뒤에 숨겨진 목적을 먼저 파악해야 해.

“눈에 잘 안 띄어요” “사용자가 잘 안 눌러요” 이런 게 진짜 이유일 수 있어.

그럴땐 이렇게 접근해야 해:

– 고객 요청은 바로 수정하지 말고, “왜 그렇게 말씀하셨나요?”를 먼저 물어보기

– 기능, 목표, 사용자의 행동 흐름을 기준으로 판단하기

– 때로는 ‘디자인 피드백’이 아니라, ‘비즈니스 피드백’일 수도 있음

고객의 말은 참고자료고, 디자이너의 역할은 문제의 본질을 찾아내는 것. 말을 그대로 반영하는 건 쉬워.

하지만 ‘목표를 반영하는 디자인’이 진짜 전문가야.

1
1
에드스튜디오

에드스튜디오

[모바일에서 버튼 크기는 몇 px이 적당할까?]

버튼이 작다고 UX가 깔끔해지는 건 아니야. 모바일에선 정확히 눌릴 수 있는 크기가 더 중요해.

실무에서 가장 많이 참고하는 기준

- Apple HIG, Google Material 모두 최소 44px~48px 터치 영역 권장

- 손가락 평균 터치 면적이 약 10~12mm → 디지털로 환산 시 약 44px

- 아이콘 버튼이나 텍스트 버튼도 시각 크기와 별개로 터치 영역은 확보해야 함

💡 자주 하는 실수

- 버튼 텍스트는 크지만 padding이 적어 실제 클릭 영역이 작을 때

- 버튼끼리 너무 가까워서 잘못 누를 확률이 높을 때

👉 그래서 실무 기준 정리하면:

- 버튼 높이: 44~48px 이상 (권장)

- 버튼 간 간격: 최소 8px

- 버튼 안 텍스트 크기: 14~16px이 가장 안정적

모바일 UI에선 ‘보기 좋음’보다 ‘눌리기 쉬움’이 먼저 설계돼야 해.

1
0