⛏️ 삽시일반

AI에게 UI/UX 피드백을 받아보자

오늘 구독자님을 위해 준비한 소재는 'UI/UX 분석 도구'입니다. 이 도구를 사용해서 strange.im 페이지의 UI/UX를 피드백 받아보려고 해요 :)

2024.09.08 | 조회 392 |
0
|
Hello.Stranger의 프로필 이미지

Hello.Stranger

🛸 해외 IT 트렌드를 가장 먼저 만나보세요. (매일 아침7시 뉴스레터 발행)

안녕하세요. 구독자님, 아직은 해가 뜨겁지만 하늘이 높아지는 걸 보니 가을이 오긴 했나봐요. 컴퓨터 앞에 있는 것도 좋지만, 한번씩 산책을 나가보면 어떨까요?

첨부 이미지

오늘 구독자님을 위해 준비한 소재는 'UI/UX 분석 도구'입니다. 이 도구를 사용해서 strange.im 페이지의 UI/UX를 피드백 받아보려고 해요 :)

 

1. Intro

LinkedIn을 보다보니 Junhoe Kim님의 포스팅을 볼 수 있었습니다. ChatGPT를 이용하여 UI/UX를 분석하는 도구를 만들었고, 이를 소개해 주었는데요. 

직접 사용해보고 싶으신 분은 아래 링크를 방문해주시면 되며, 사용법 또한 간단해요. 분석하고 싶은 페이지(화면)을 Drag & Drop 으로 업로드를 해두고 분석 요청을 하면 끝이에요. 

추가로, 제작자의 Comment를 빌리자면  디자인 의도를 구체적으로 설명하면 더 정확한 피드백을 받을 수 있다고 합니다. 이 외에 제작자가 말한 이 도구의 주요 기능과 사용 팁은 아래와 같으니 참고해주세요.

주요기능

  • 페르소나 맞춤형 피드백
  • 디자인 의도 반영
  • 시선 흐름과 정보 위계 분석

사용 팁

  • 디자인 의도를 구체적으로 설명할 수록 정확한 피드백을 받을 수 있음
  • 페르소나 설정도 꼼꼼히 하면 좋음
  • 피드백은 천천히, 단계적으로 적용하는게 좋음

 

2. 사용해보기

오래 전 포스팅에서 말씀드리긴 했지만, stranger.im 사이트는 Claude AI를 사용하여 Front End를 개발했습니다. 이 사이트는 다양한 해외 Article을 한글로 요약하여 카드뉴스 형태로 제공중인 사이트이며, 뉴스레터 구독하기 전의 랜딩 페이지라고 보시면 됩니다.

이 사이트의 페이지와 함께 'UI/UX 분석기'에 피드백을 달라고 요청을 해보았어요. 더불어서 3why 기법을 토대로 피드백을 달라고 했어요.

피드백 요청
피드백 요청

아래 결과를 보면 알다시피, GPT 답게 자세한한 피드백을 줘요. 특히나 UI/UX 분석이 전문이다보니 사용자의 시선 흐름에 관한 피드백도 놓치지 않았네요. 또한 놀라운 점은 현재 페이지의 문제점을 정확히 파악하고 개선 방향도 답변해주네요.

UI/UX 분석 및 개산방향 도출
UI/UX 분석 및 개산방향 도출

 

위 답변과 더불어서 3why방식으로 제시해준 개선 방안을 볼게요. 몇 가지 문제점이 있고 그 게 왜 문제인지 스스로 why를 던지며 질답하는 것을 볼 수 있습니다. 역시나 뉴스 카드 사이의 문제가 지적 되었으며, 세로로 긴 모달이 가독성이 좁다는 추가적인 의견을 주었어요.

3why 방식으로 개선 방안 도출
3why 방식으로 개선 방안 도출

위의 개선안을 또 분석해보고 현재 사이트에 반영한다면, 또 새로운 웹페이지가 만들어지지 않을까 싶네요. :D

 

3. 결론

Juneho님이 만들어 준 UI/UX 분석 도구를 활용하여 stranger.im 페이지의 피드백을 받아본 내용을 정리해보았어요. 이 도구를 사용하면서 느낀 장점 중 하나는 매우 직관적인 피드백 시스템이라는 점입니다.

간단한 드래그앤드롭으로 분석을 요청할 수 있으며, 결과 또한 상세하게 제공된다는 점이 인상 깊었습니다. 특히, 3why 기법을 적용해 문제를 깊이 파악하고 개선 방향을 제시하는 방식은 매우 유용했어요.

오늘 다룬 도구는 이런 부분을 개선하고자 하는 디자이너나 개발자에게 큰 도움이 될 수 있을 거라 생각들어요.

구독자님도 혹시 웹페이지나 프로젝트의 UI/UX에 대해 고민이 있으시다면, 이 도구를 한번 사용해보는 것을 추천드립니다!

앞으로도 흥미로운 도구와 팁을 소개해드릴테니, 기대해주세요! 😊

감사합니다.


 ✅ 오늘의 레터는 어땠어요?

아쉽지만 구독자님을 위해 준비한 오늘의 뉴스레터는 여기까지입니다. 🥹 오늘 받은 뉴스레터에 대한 솔직한 피드백을 주실 수 있으실까요? 또한 받아보고 싶은 주제가 있다면 적어주세요. 뉴스레터 발행에 참고토록 할게요. 🙏

구독자님의 생각은?

 

Threads | Instagram | X(Twitter) | Linkedin


 

다가올 뉴스레터가 궁금하신가요?

지금 구독해서 새로운 레터를 받아보세요

이번 뉴스레터 어떠셨나요?

Hello.Stranger 님에게 ☕️ 커피와 ✉️ 쪽지를 보내보세요!

댓글

의견을 남겨주세요

확인
의견이 있으신가요? 제일 먼저 댓글을 달아보세요 !

다른 뉴스레터

새로운 직원들을 소개합니다. 의 썸네일 이미지

새로운 직원들을 소개합니다.

기존에는 저와 뉴스를 큐레이션 해주는 큐레이터만 있었는데, 두 직원을 더 고용했어요. Contents reviewer와 Editor인데요. 이 Contents reviewer자와 Editor가 어떤 일을 하는지에 대해 다루어 볼게요.

⛏️ 삽시일반

| 멤버십
2024.10.26
조회 570 | 0
???: "2025 수능 국어 지문에 나온 도메인 먹음 ㅎ" |  Domain을 알아보자의 썸네일 이미지

???: "2025 수능 국어 지문에 나온 도메인 먹음 ㅎ" | Domain을 알아보자

안녕하세요. 구독자님, 혹시 아래 뉴스를 보신적이 있으신가요?

⛏️ 삽시일반

2024.11.16
조회 353 | 0
[멤버십 전용] ChatGPT로 완성하는 나만의 커리어 로드맵의 썸네일 이미지

[멤버십 전용] ChatGPT로 완성하는 나만의 커리어 로드맵

안녕하세요. 구독자님

⛏️ 삽시일반

| 멤버십
2024.10.19
조회 530 | 0
Tab만 눌렀는데 개발이 끝났어요 | Cursor 사용해보기의 썸네일 이미지

Tab만 눌렀는데 개발이 끝났어요 | Cursor 사용해보기

오늘은 이러한 IDE들 중에서도 'Cursor'라는 IDE를 소개드리려고 해요. Cursor는 VSCode를 기반으로 한 편집 도구인데, 여기에 AI 기능이 더해져서 큰 도움이 되더라고요.

⛏️ 삽시일반

| 멤버십
2024.11.09
조회 769 | 0
[멤버십 전용] 흑백요리사 최강록 셰프 만들기... AI를 곁들인의 썸네일 이미지

[멤버십 전용] 흑백요리사 최강록 셰프 만들기... AI를 곁들인

오늘 구독자님에게 공유드릴 내용은 AI 최강록 셰프 만들기에요.

⛏️ 삽시일반

| 멤버십
2024.10.12
조회 657 | 0
Apple Siri를 AI Siri로🤖: 애플 M4 칩 시리즈 소개의 썸네일 이미지

Apple Siri를 AI Siri로🤖: 애플 M4 칩 시리즈 소개

M4 칩은 무엇이고 어떤 성능이 있길래 모든 기기에 탑재했는지 정리해서 공유드려 볼게요.

⛏️ 삽시일반

| 멤버십
2024.11.03
조회 346 | 0
© 2024 Hello.Stranger

🛸 해외 IT 트렌드를 가장 먼저 만나보세요. (매일 아침7시 뉴스레터 발행)

뉴스레터 문의hello.stranger1337@gmail.com

메일리 로고

자주 묻는 질문 서비스 소개서 오류 및 기능 관련 제보

서비스 이용 문의admin@team.maily.so

메일리 사업자 정보

메일리 (대표자: 이한결) | 사업자번호: 717-47-00705 | 서울 서초구 강남대로53길 8, 8층 11-7호

이용약관 | 개인정보처리방침 | 정기결제 이용약관 | 라이선스