[3주차]하이쿠2기 중급반-앱 디자인 만들어 보기

처음에 실시간 강의로 따라 해 보다가 중간에 로그인 오류가 나서 일단 강의를 듣고 난 후 다시보기 녹화본으로 멈추면서 같이 따라 해 보기로 따라 해 봤어요~ 듣다가 놓친 부분이 있으면 다시 되돌아가기 해서 따라해 보고 사진 아래에 과정 첨부해 드려요~!

구글 플레이 스토어에서 캡처한 사진을 바탕으로 위 내용을 토대로 클로드로

글 작성 할 수 있는 서비스 대표 화면 3가지 버전으로 만들어줘 3가지 버전을 만들었어요~

위 사진 처럼 3가지를 분해해 나온 결과를 이미지로 첨부해 드려요

위 내용을 토대로 글 작성 할 수 있는 서비스 대표 화면 3가지 버전으로 만들어줘 3가지 버전 만들었어요~

위 2개 사진처럼 클로드로 문구 만들었어요~!

이 서비스의 소개 문구 3종을 써줘.

한 줄 (앱 첫 화면 상단용, 20자 안팎)

세 줄 (커뮤니티 소개용. 누가 · 뭘 하면 · 뭐가 나온다)

열 줄 (성과 공유회 소개용. 지금 어떻게 하고 있나 → 이 앱이 있으면 → 아직 안 되는 것)

[지킬 것]

• 세 문구의 메시지는 같아야 해. 표현만 다르게.
• 숫자(건수·시간)는 위키에 있는 것만. 없으면 쓰지 마.

위에 여기까지는 클로드로 만들어 보았고 아래 부터는 세부적인 디자인쪽으로 수정해 보기 위해

클로드로 짠 구조를 토대로 스티지(stitch) 에서 모바일앱 버전과 데스크탑앱 버전 두가지를 다지안 해 보았어요

처음에는 네온도쿄색상으로 디자인 해 보았는데 다크색상에 그림이 어두운 골목길 느낌이라

귀여운 디자인으로 다시 수정해 만들어 보고 귀여운 디자인으로 최종 마무리했어요~ㅎㅎ

(ps. 전에 홈페이지 만들기도 클로드랑 러버블로 디자인해 만들어 봤는데 따라해 보니

이 경우와 비슷해 보였어요~!

하이쿠 홈페이지 만들기 때도 클로드로 디자인한 홈페이지 구조를 토대로 러버블에서 디자인 해 보았어요~! 그때만든 홈페이지 지금도 잘 사용하고 있어요~ 디자인은 글에 올린 디자인에서 약간 수정이 되었습니다 강의 해 주셔서감사합니다 ~!)

위 사진은 스티치로 디자인을 수정해 보았어요 구성은 클로드에서 했던 구성 그대로 가져와서 디자인 해보았어요

모바일앱과 데스크탑앱 두가지 버전으로 만들어 봤는데 색상이 구성이 예뻐 네온도쿄스타일 색상으로 디자인 선택 해 보니 디자인 결과에서 밤거리 그림을 다시 수정해 보고 싶어 아래 귀여운 스타일로 바꿔봤어요~ㅎㅎ

귀여운 스타일로 바꿔 보았고 세부적인 내용도 아래 사진처럼 수정 해 보았습니다

고양이가 귀엽네용~ㅎㅎ

위 사진은 데스크탑 앱 버전 최종으로 디자인 해 보았어요

위에 있는 사진 2개는 다른버전의 모바일앱 최종 버전으로 수정해 보았습니다

이번 강의 덕분에 디자인을 재밌게 해 보아서 유용했고 재밌었요~

긴글 읽어 주셔서 감사드립니다~