🎵 자세한 포트폴리오
Meissa 브랜드 아이덴티티 디자인
Billie
👍
프로젝트 개요
회사: (주)메이사
프로젝트 기간: 2021년 5월 — 2021년 6월 (1개월)
참여 인원: Product Designer (본인)
디자인 기여도: 100%
역할: 프로젝트 기획, 리드
프로젝트 배경
메이사는 스마트 건설 플랫폼을 개발/판매하는 회사로, 국내 유일 드론 영상 분석 기술을 갖춘 곳입니다. 드론으로 촬영한 2D 이미지를 정합하여 고해상도 지도로 활용하거나 3D로 모델링 된 가공 데이터를 제공합니다.
2020년, (주)카르타에서 (주)메이사로 사명을 변경하면서 새로워진 비전과 미션을 반영하고자 Brand Identity를 업데이트할 필요가 있었습니다.
Meissa Vision
단순 변환 데이터 제공을 넘어 loT, BIM, 360워크스루, CCTV 등 다채널로 수집된 데이터 결합하여 고객들에게 새로운 인사이트와 가치를 제공하겠다
1. Symbol
기존에는 로고 이미지와 상관 없이 원하지 않아도 ‘드론'이 주로 강조되는 경향이 있었습니다.
기존 로고는 일부러 건설사들처럼 두껍고 우직한 이미지를 만들어서 건설 산업의 회사라는 걸 알리려는 의도였다고 해요.
메이사로 로고를 바꾸게 된 시점에는 ‘기술 회사' 느낌을 더 강조하고 싶다는 니즈가 생겼습니다.
당시 새로 설정된 제품 목표를 바탕으로 메이사 심볼을 제작했습니다.
기존 [드론 데이터] + [BIM], [CCTV], [360도 파노라마 이미지], [실시간 위치] ... 등등
더 다양한 유형의 건설 현장 데이터를 Meissa Platform 안에 ‘융합'하여 생기는 인사이트와 가치를 전달하겠다는 의미를 담게 되었습니다.
메이사에서 제공하고자 하는 '융합'은 일반적인 '통합'과 다릅니다.
건설에는 매우 다양한 데이터와 문서가 필요하지만, 정작 한 곳으로 잘 모이지 않고 각각 다른 솔루션을 사용하며 비효율을 감내하고 있습니다.
메이사는 이러한 문제를 해결하기 위해 다양한 데이터를 융합하여 생기는 인사이트를 제공하고자 합니다.
그래서 우리 플랫폼에 다양한 데이터가 모이는 장면을 상상한 시안이 최종 채택되었습니다.
채택 이후에 알게된 것
아주 많은 시안이 나왔었지만 결국 CARTA 당시 심볼과 적절한 유사성(육각형, 청록색 ...)이 있는 시안으로 채택되었습니다.
CARTA 고객사, 인지하던 회사들이 금방 연결해서 기억할 수 있는 장점도 있었겠다 싶어요.
2. Typefaces
💬
언어에 따라 쓰는 폰트가 달라요.
국어 문서 : Pretendard
일어 문서 : Pretendard JP
영어 문서 : Eloquia
2-1. 영어용 글꼴 - English : Eloquia
Eloquia라는 Grotesk(그로테스크) 계열의 유료 글꼴을 쓰고 있습니다. 메이사는 건설사를 대상으로 한 B2B 기업이므로 이성적, 논리적인 수렴형 메시지를 담은 기업입니다. 따라서 중립적이고 이성적인 인상을 줄 수 있는 Grotesk 계열이면서도, 지나치게 차갑고 딱딱한 분위기를 내지 않게 하기 위해서 Geometirc의 대중적인 특징도 함께 품은 글꼴을 최종 선택했습니다.
Geometric 계열에는 대표적으로 Google Sans나 삼성 Sharp Sans가 있습니다. 이런 글꼴은 대중적이고 친근한 느낌이 강한데, 제목이 아닌 본문과 같은 줄글에서 사용하게되면 눈이 금방 피로해지기 때문에 여기 저기 통일하여 사용하기 까다로운 경향이 있습니다.
저는 작업 효율성(타부서와의 커뮤니케이션 미스 줄이기, 적절한 폰트 찾는 시간 줄이기 ...)을 위해 로고부터 본문까지 다 커버 가능한 서체를 원했습니다.
저희가 주고 싶은 이미지는 이성적, 논리적인 수렴형 메시지에 가깝습니다. 근데 너무 차갑고 딱딱한 분위기는 또 안된다고 생각했어요. 그래도 고객들에게 우리가 만든 서비스가 금방 잘 쓸 수 있을 것처럼 다가오면 좋겠다는 마음도 있었거든요.
→ Eloquia는
Grotesk 계열 글꼴 중에서도 Geometric의 성격을 어느정도 품고 디자인 되었기 때문에, 제 고민을 해결해줄 수 있었습니다.
Display(제목용이라고 생각하셔도 무방)와 Text(본문용이라고 생각하셔도 무방)용 글꼴 구분이 잘 되어있고,
돈을 주고 사는 만큼 두께도 다양하여 확장성까지 있다고 생각했어요.
2-2. 국어/일어용 글꼴 - Korean(, Japanese) : Pretendard (, JP)
Pretendard라는 무료 글꼴을 사용하고 있습니다.
원래는 Noto Sans KR을 쓰고 있었지만 부족함이 많았어요.
한글, 숫자, 영문 디자인이 서로 조화롭지 않았어요.
기본 자간이 넓어서, 매번 자간을 수정해줘야 하는 추가작업이 필요했어요.
영문 폰트를 Eloquia로 정한 얼마 뒤, 국내에서Pretendard라는 디자이너들의 고충을 해소해줄 무료 폰트가 배포되었어요.
한글, 숫자, 영문 디자인이 훨씬 조화로웠어요.
숫자/영문 디자인이 영문 글꼴로 지정했던 Eloquia와 잘 맞아떨어졌어요.
Web에 적용했을 때, Window 환경에서도 글자를 판독할 수 있는 정도가 Noto Sans와 비슷했어요.
(그 전에 Spoqa라는 글꼴을 적용했을 때는 엄청 심하게 깨졌었고, 판독성에 큰 영향을 미쳤거든요)
3. Colors
Point Color
Point Color라고 부르지만, 실제로는 Main Color, Primary Color 등 사용하는 용어는 정해져있지 않아요.
청록색이 인쇄나 안좋은 모니터로 보는 UI에 쓰기엔 모호하고 어려운 부분이 있는데도 유지하기로 했어요.
일단 로고만 바뀌는 게 아니라 사명까지 한 번에 바뀌는 것이기 때문에, 어느 정도 이전 로고에서 보여주던 컬러를 유지하는 게 좋겠다고 합의했었거든요.
이미 디자인된 플랫폼 디자인이 청록색에 맞춰서 되어있기 때문에 (물론 컬러 코드 바꾸면 되는 거기야 하지만… 공수가 더 들 수밖에...) 대응 리소스를 줄일 수 있는 방안이기도 했어요.
CARTA 로고를 디자인했던 디자이너의 의도대로, 신뢰를 나타내는 컬러로도 적당하다고 판단했고요.
Light 모드에서는 #00ACC1, Dark 모드에서는 #26C6DA를 사용해요.
Background Color
포인트 컬러인 청록색을 받쳐주던 남색Navy을 블랙Black으로 변경했어요.
원래 청록색은 완전한 파란색/초록색의 옆에 있어야 더욱 청록처럼 보이는 경향이 있고, 그래서 남색을 같이 썼었거든요.
엔젤스윙, Xite cloud를 비롯한 경쟁사부터 + (특히 한국이 그런건지...) 기업 로고로 파란색을 너무너무너무 많이 쓰는 경향이 있어서, 조금이라도 다르게 하고 싶은 마음도 있었어요.
Grey Color
회색조 컬러는 가벼운 사용경험을 위해서 Cool Grey 계열을 사용합니다.
4. Elements (Products)
제품의 특징에 따른 결정
메이사는 건설현장의 다양한 데이터를 보여줘야 하는 특징이 있는데요.
→ 그래서 한 화면 안에서 많은 정보들을 보여줄 때 사용자가 부담을 덜 수 있는 방향을 고민하게 되었고,
→ 각 정보들끼리의 그룹핑이 잘 되게 하기 위해 카드 UI/디자인을 적극적으로 활용하게 되었습니다.
Card UI의 예시
Card UI는 보통 한꺼번에 많은 정보를 보여줘야 할 때, 각 정보들 간 구분이 잘 될 수 있도록 Card 안에 묶어주는 디자인 형식입니다.
그래서 Apple에서도 iOS 14와 macOS 11 (Big Sur) 버전부터 적극적으로 활용하고 있는 스타일이기도 하여 채택하고자 했습니다.
Subscribe to 'billieyoung'
안녕하세요, 프로덕트 디자이너 김신영입니다.
Subscribe
👍
Billie
goming! 여러분의 생각들이 사라지지 않도록 도와드릴게요!
goming goming은 칸반 보드 형식의 생각 관리 앱입니다. 저만의 자잘한 고민들을 한꺼번에 관리하는 방식을 칸반 보드 스타일의 앱으로 풀어낸 컨셉 프로젝트입니다. 프로젝트 개요 개인 프로젝트 프로젝트 기간: 2023년 6월 저는 제가 운영하는 1인 비공개 카페에서 고민을 털어둡니다. 카페 게시판 중 고민을 임시 저장해두는 저장소 [고민들 일단 임시 저장] 게시판이 있고, 그 중 해결된 고민이 생기면 그런 고민들을 옮기는 저장소 [해결한 고민들이 오는 곳] 게시판이 있습니다. 카페 게시글로 관리해도 괜찮지만, 가끔 휴대폰에서 빠르게 관리하고 싶다는 생각이 들어 '메모' 앱을 사용해봤지만 텍스트를 일일이 적고 지우고 복사하고 붙여넣는 과정이 번거로웠습니다. '노션' 앱은 제 고민들을 관리하기에는 기능이 너무 많고 무거웠습니다. 다른 노트테이킹 앱들도 마찬가지였습니다. 카페 게시글로 관리할 때 불편했던 점과 니즈를 추려봤습니다. 해결되지 않은 고민과 이미 해결된 고민을 한눈에 보고 싶다 해결되었다고 생각한 고민을 다시 고민하게 될 때가 있음
Billie
MeiDay: 신규 제품 고객 인터뷰 진행과 MVP 기획안 변경
신규 제품 고객 인터뷰 진행과 MVP 기획안 변경 현장 근로자의 위치를 웹에서 실시간으로 확인할 수 있는 안전 위치 공유 서비스 (구 MeiDay, 현 Meissa Guard)의 MVP를 구축했습니다. 인터뷰를 진행하면서 가설을 검증하고 고객의 진짜 페인포인트를 찾고 솔루션을 도출했습니다. 인사이트를 팀원들과 공유하고 MVP 기준을 바꾸면서 변경을 주도하는 과정을 경험했습니다. 차례 프로젝트 개요 초기 가설과 컨셉안 고객 인터뷰 결과물 프로젝트 회고 1. 프로젝트 개요 회사: (주)메이사 프로젝트 기간: 2022년 4월 — 2022년 5월 타겟 유저: 건설현장 안전관리자, 건설본사 안전팀, 건설현장 근로자 참여 인원: PO (1), Product Designer (본인 포함 2), FrontEnd Engineer (1), BackEnd Engineer (2), Flutter Engineer (1) 역할 및 기여도: 고객 인터뷰 및 솔루션 도출, 디자인 룩앤필 제작 (70%) 와이어프레임, 플로우 기획 (50%) 방향성 변경 이후에는 메인 디자이너 교체하여, 상세 디자인 대응 및 QA 파트를 서포트
Billie
Meissa Platform: 이슈 관리 기능 제안, 인터뷰를 통한 가설 검증
Meissa Platform: 이슈 관리 기능 제안, 인터뷰를 통한 가설 검증 건설은 프로젝트 기간이 길고, 의사소통 이해관계자가 많습니다. 메이사는 스마트건설 솔루션이 주 제품으로, 건설의 다양한 업무를 디지털화합니다. 현장에서 메신저로만 이슈를 관리할 때 생기는 어려움을 해소하고자 했습니다. 고객의 요구가 명확한 B2B 제품이지만 고객의 요청이 아닌, 팀 내부에서 고객의 문제를 파악해 [문제정의, 가설수립, 검증, 피드백] 사이클을 진행한 프로젝트였습니다. Behance에서도 포트폴리오를 확인하실 수 있습니다. 차례 프로젝트 개요 배경 상세 문제, 가설, 솔루션 결과물 현장 인터뷰, 인사이트 프로젝트 결과 분석 프로젝트 종료 이후 개선 이터레이션 회고 마치며 1. 프로젝트 개요 회사: (주)메이사 프로젝트 기간 기능 논의와 제작: 2022년 8월 — 2022년 11월
👍
3