아름다운 레시피 앱, 'Creme'
영감을 주는 UX 디자인 사례
심미적인 앱을 만나보기가 어려운 요즘,
간결하면서도 직관적인 인터랙션을 제공해 아름답게까지 느껴지는 요리 앱이 있어 소개해본다.
구독 중인 디자인 뉴스레터에서 소개해줘서 알게 된 Creme 이라는 앱이다.
Creme App 로고크렘 (Creme)은 세계 각국의 셰프들의 요리 비법, 트렌디한 레스토랑의 레시피 콘텐츠를 영상 포맷으로 레시피 순서대로 보여준다. 요리사들이 직접 요리하는 모습을 단계별 영상으로 확인할 수 있으며, 사용자가 요리를 하며 실시간으로 레시피를 확인하고 쉽게 따라 할 수 있도록 해준다.가장 좋은건 요리를 하는 사람 페이스대로 요리를 할 수 있게 돕는다.
사용자들이 직접 콘텐츠를 올리는 방식이 아닌 크렘에서 자체적으로 셰프들의 요리 영상을 감도 높게 촬영하고 일정한 톤 앤 매너로 편집하여 유료 구독 모델로 서비스를 제공하고 있다. 움직이는 쿠킹 매거진 같은 느낌이다.
요리를 하는데 최적화된 어포던스
유튜브에서 레시피를 참고하는 경우가 많은데, 유튜브는 요리하며 레시피를 참고하는 용도로는 적절한 어포던스를 제공하지는 못한다. 예를 들어 영상을 보다가 설탕이 몇 스푼 들어갔었는지 기억이 나지 않아 뒤로 몇 초씩 이동해서 불필요한 내용도 반복적으로 들어야 하거나 손으로 타임 바(time bar)를 조정해야 한다.
요리할 때는 청결이 중요한데 아무래도 세균(?)이 많은 핸드폰을 만져야 하고, 핸드폰에 음식물이 묻을 수도 있기 때문에 '요리를 하는 도중'에 사용하는 앱으로서의 유튜브는 사용성이 떨어지는 편이라고 생각한다.
반면 Creme은 요리를 하면서 레시피를 실시간으로 확인해야 하는 사용자의 니즈를 아주 잘 포착해 사용자의 목표를 이루도록 돕는 인터랙션 설계에 힘을 실은 것 같다.
레시피 인터랙션레시피의 다음 단계로 넘어가기 위해 아래로 스와이프 하거나 화면 하단 영역을 가볍게 터치하기만 하면 되고 전 단계로 이동하려면 반대로 위로 스와이프 하거나 상단 아무 영역을 터치하면 된다.
요리를 하며 핸드폰을 만질 수 없는 상황일 때 유용할것 같다.
이렇게 모든 레시피마다 셰프가 생동감 있게 요리를 하는 영상이 레시피 순서별로 나눠져 있다.
영상에서는 셰프가 말을 하면서 가르치거나 하진 않고 감각 있는 배경 음악과 함께 분주한 셰프의 손놀림이 반복적으로 재생된다. 단계에 대한 설명은 간결하고 짤막한 텍스트로 하단에 배치된다.
요리를 하며 길고 장황한 텍스트를 읽고 싶은 사람들은 없을 것이라는 점을 잘 파악하여 짤막한 레시피 설명으로 일관한다.
보통 블로그로 요리 레시피를 보면 텍스트가 너무 많아서 본론이 있는 레시피 과정과 재료 섹션만 봤던 것 같다. 요리 블로그에 일상적인 내용이나 맥락을 읽는 것도 재밌지만 '요리를 하는 상황'에서는 불필요하기 때문이다.
오른쪽 상단에는 미니멀한 다이얼의 형태로 현재 어느 단계까지 왔는지 직관적으로 확인할 수 있다.
단계가 총 12개라고 쳤을 때 그냥 평범하게 1/12, 2/12 이렇게 표기해도 됐을 텐데 저렇게 간단한 심벌로 디자인을 훨씬 우아해 보이게 만들었다.
레시피 계량 단위 선택
예전에 베이킹을 할 때 가끔 해외 블로그에서 레시피를 참고할 때도 있었는데, 계량 단위가 달라서 환산해야 했던 것이 번거로웠다. 하지만 크렘에서는 모든 레시피에 대한 데이터베이스를 갖고 있기 때문에 서비스 온보딩 시 선택한 계량단위 (metric 또는 imperial)로 통일해서 보여준다.
그로서리 리스트
레시피의 재료를 장보기 목록에 담아 따로 저장해 놓는 기능이다. 재료만 빠르게 참고할 수 있고, 장을 다 본 재료는 체크를 하여 목록에서 삭제할 수도 있다.
장보기 목록에 있는 식품을 바로 구매할 수 있게 식품 유통사와 제휴를 맺어 레시피 콘텐츠에서 푸드 커머스까지도 확장할 수도 있을 것 같다.
플레이리스트
집에서 만든 요리를 먹으며 레스토랑 분위기를 낼 수 있도록 하이엔드 레스토랑의 음악 플레이리스트를 제공한다. 스포티파이 플레이리스트와 연결되어있어 스포티파이를 쓰는 경우에만 음악을 들을 수 있다.
단순히 레시피 정보만 제공하는 것이 아닌 요리를 하는 사람의 실제 행동과 니즈 기반으로, 요리를 하기 전, 도중, 요리 이후 분위기 좋게 먹는 단계까지 고려해 총체적으로 설계된 UX덕분에 요리를 하는 즐거움을 발견할 수 있는 앱인 것 같다!
커뮤니티 - 완성한 요리 인증
하나의 레시피로 요리를 완성하면 마지막 단계에서 사진 찍기, 저장하기, 공유하기 등을 할 수 있다. 사진 촬영을 누르면 완성한 요리를 사진으로 찍어 커뮤니티 피드에 업로드된다. 슬랙이나 디스코드처럼 피드에 이모지도 달아줄 수 있다. 소셜 요소가 그렇게 필요한 앱인지는 모르겠다. 신규 서비스여서 그런지 아직 커뮤니티가 활성화되지는 않은 듯 했다.
구독료는 월 4600원대이다. 집에서 색다른 요리를 자주 하는 사람들을 위해서라면 괜찮은 서비스 같다.
일단 레시피 보면서 요리하기가 굉장히 편리하게 되어 있어서 꼭 레스토랑 급 요리가 아니어도 일상적으로 해 먹을 수 있는 요리도 레시피를 까먹을 때가 종종 있는데 이런 앱을 참고할 수 있다면 좋을 것 같다. 이러 콘텐츠 큐레이션 서비스의 경우 특히나 비주얼 톤 앤 매너가 콘텐츠의 첫인상을 좌지우지하기 때문에 모든 이미지, 영상의 분위기나 감도가 통일되는 것이 중요한 것 같다. 아이콘 사이즈도 이 서비스의 경우 일반 앱보다 작은 편인데, 전체적 분위기에 작은 사이즈가 훨씬 잘 어울린다.
서비스의 틀과 플로우도 중요하지만 그 안에 들어가는 내용물의 퀄리티 또한 전체적인 UX에 기여하기 때문에 비주얼에 대한 감각이 중요한 것 같다.
감각은 다양한 UXUI 레퍼런스를 보는 것도 좋은 방법이지만 잡지나 사진, 포스터와 같은 다양한 시각 매체의 좋은 디자인 사례들을 보며 조화로운 디자인의 구성, 컬러와 밸런스를 다양하게 참고하는 것이 나는 도움이 되는 편이다. 이 팁은 어떤 호주 UX 디자이너의 유튜브 채널을 통해 알게됬는데, 이 분은 인테리어에서도 UI 디자인 영감을 얻는다고 한다. 최종적인 결과물의 형태, 용도는 다르지만 모든 디자인 분야의 출발점과 접근방식은 서로 일맥상통하는 것 같다. 디자인이란 정해진 답이 없고 항상 어떤 관점에 의해 형성된 문제의 다양한 해결책 중 하나의 가능성으로 제시하는 것이기 때문이다.
디자인이 궁극적으로 기여하고자 하는 것과 목표는 그 디자인이 무엇이 될 수 있는지(어떤 가능성을 가지는지)에 대한 기대 수준을 높이는 것이라고 생각해요.
- Paula Scher
어떤 솔루션이건 관점에 따라 맞을 수도 있고, 적합하지 않을 수 있다. 그 자체가 맞거나 틀린 게 아니다.
솔루션의 모습은 관점에 의해 달라질 수밖에 없고 최종적인 솔루션이란 존재하지 않기 때문이다. 계속 변화하는 환경에 맞춰 솔루션도 진화하기 때문에 옳은 관점을 먼저 세우는 것이 점점 중요해질 것 같다.
'관점'은 나에겐 아직 추상적이어서 문제의 관점을 어떻게 잡아야 하는지는 앞으로 더 많은 경험과 시행착오가 필요할 것 같다.
정보 과부하의 문제에 '관점을 가지는 것'은 가장 인간적인 해결책이며, 소화 가능한 최소한의 본질로 많은 것을 줄이는 직관적인 과정입니다. 콘텐츠 과잉인 세상에서 관점은 앞으로 가장 희귀한 자원중 하나가 될 거예요.
- Paul Saffo
