[스터디] 김성훈_day 01

레퍼런스 스터디 첫 번째!

디자인을 시작했을 때 부터 많이 이용했던 behance에서 레퍼런스를 찾아봤어요!
아직 프로덕트 디자이너로써 디자인을 보는 안목이 부족하기 때문에 더 많이 찾아보게 되는 것 같아요.🥹

레퍼런스를 서치하는 과정에서 제가 어떤 디자인을 선호하는지도 알 수 있어서 의미 있는 시간인 것 같네요!👍

그럼 찾아봤던 레퍼런스를 공유해볼게요!

➡️ 원본 출처

이번 레퍼런스는 사운드로 음악을 검색하는 앱 디자인입니다! 전체적으로 어두운 무드의 디자인과 핵심 기능을 쉽게 인식하고 사용할 수 있는 레이아웃, 인터렉션(상호작용), 그래픽 모션 디자인까지 너무 잘 된 디자인이라고 생각이 들었어요.

레퍼런스 찾다보니 저는 개인적으로 다크 모드 상태의 디자인을 좋아하는 거 같아요.👍
몰입이 더 잘되고 콘텐츠도 눈에 잘 띄는 것 같은 느낌을 받았어요.
원본 페이지 최상단 영상에 나오는 사운드도 너무 좋으니 꼭 들어보세요!!🔊

음악을 검색했을 때 나오는 페이지도 군더더기 없이 깔끔했어요. 이미지 요소와 텍스트의 배치, 계층 구조도 잘 고려한 디자인이라 봤을 때 불편한 점이 없었어요. UI 디자인 할 때 텍스트 계층 구조 감각을 익히기 쉽지 않다고 하는데 레퍼런스를 많이 찾아보면서 감을 익혀야겠습니다!🔥

앨범 커버와 함께 페이지가 생성되는 애니메이션도 너무 멋있으니 꼭 확인해보세요!

UI 카드 디자인도 어두운 무드에 잘 어울릴 수 있도록 투명한 효과를 적용시킨 것도 너무 괜찮은 것 같아요. 배경과 요소가 적절히 어우러져 조화로운 느낌이 듭니다 🥹

음악이 재생됨에 따라 노출되는 가사에 그라데이션 컬러를 적용해 좀 더 생동감 있는 느낌이 들었어요.
단순히 화이트 컬러 대비만으로 적용할 수 있었을텐데 이런 디테일을 살리다니..차별화를 위해 고민한게 느껴집니다 ㅠㅠ

세상에 디자인 잘하는 사람이 왜이렇게 많은지..😭
다시 한번 디자인의 벽을 느끼는 순간이었습니다ㅋㅋㅋㅋㅋㅋ

이번 주에 학습했던 AI툴에 대해서 고민하다가 프로덕트 디자인에 사용되는 툴을 검색해봤어요!
아니나 다를까 엄청 많더라구요!! 관심 있으시면 아래 포스팅 읽어보시는 걸 추천드려요!

➡️ UI/UX에서 사용되는 AI 툴

어느 정도 도움이 될까해서 테스트를 한번 해봤는데 결과는 기대 이상이에요.. 미쳤습니다..
저는 Relume AI 라는 툴을 사용해봤는데 UX/UI 디자인할 때 필수로 필요한 과정들을 프롬프트만 입력하면 자동으로 생성해주더라구요..?

아래 이미지는 프롬프트를 입력해서 임의의 앱 사이트맵을 생성한 거예요.

10초도 안걸렸습니다..?
심지어 피그마랑 연동이 되서 수정도 자유롭게 할 수 있다고 해요!👍

수업 시간에 배운대로 영문 프롬프트를 작성하고, 페이지 수, 언어를 선택해서 Generate 버튼을 누르면

이렇게 사이트 맵을 만들어줍니다..?ㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋ 대박이지 않나요ㅋㅋㅋㅋ
나중에 앱 기획 단계에서 활용하면 좋을 거 같네요!!

미쳐버린 AI들..🤖

제가 준비한 레퍼런스는 여기까지 입니다👋
동기분들한테 도움이 되었다면 너무 좋겠네요!!