[노마드코더 트위터 클론 챌린지] 01 와이어프레임

 

자기소개

디자인학과에서 배운 코딩과 UI/UX 수업을 통해 웹/앱 서비스 제작에 관심을 갖게 되어 결국 개발자를 꿈꾸게 된 취준생입니다! 진행한 프로젝트에서 주로 React를 사용하여 프론트엔드 개발을 맡아왔습니다. 트위터 클론 코딩을 통해 React 복습 + 제가 원하는 기능이 포함된 서비스를 처음부터 끝까지 제 손으로 완전히 구현해보는 것을 목표로 달려보겠습니다🏃‍♀️🏃‍♀️

 

메인 페이지 와이어프레임

 

포인트 색상 및 로고

메인컬러 #8A77FF

 

음악 공유 SNS라는 서비스 기획에 맞게 음표로 웃는 얼굴을 형상화한 로고를 구상했습니다.

 

 

구현하고 싶은 사항

• 게시글 작성 시 원하는 음악을 검색해서 선택하고, 그 음악과 관련된 내용을 작성하여 공유할 수 있는 SNS 서비스를 만들고 싶습니다.
• PC 화면을 메인으로 기본적인 게시글 작성 기능, 팔로잉, 팔로워, 좋아요, 실시간 TOP100 목록을 함께 보여주는 것을 필수로 구현하고 싶습니다.
• 추가로 해시태그 검색 및 원하는 해시태그를 구독하면 해당 해시태그가 포함된 글들의 타임라인을 만들어주는 기능을 구현하고 싶습니다.

 

고민

기능적인 욕심도 많고 UI도 예쁘게 꾸며보고 싶어서.. 짧은 시간 내에 원하는 기능을 모두 구현할 수 있을지 걱정이 되네요🥲 우선순위를 잘 세워서 열심히 해보겠습니다!

 

 

공유하고 싶은 팁

와이어프레임에 사용한 아이콘들은 figma의 플러그인 중 하나인 Popicons를 통해 사용했답니다. 종류가 엄청나게 많지는 않지만 필수적으로 있어야할 건 다 있어요! 동글동글 귀여운데다 깔끔하고, 또 Line, Solid, Duotone 세가지 스타일의 아이콘을 제공해서 제가 애용하는 피그마 플러그인 중 하나입니다ㅎㅎ