로그인

Dallee's Blog

Designer, Slashpage Inc

Product

이미지 업로더 개선 - UI 변경 및 Lummi 연동
직접 업로드한 이미지에서만 제공되던 편집 기능을, 스톡 이미지를 사용할 때도 동일하게 활용할 수 있도록 구조를 변경했다. 선택된 스톡 이미지를 업로드 형식으로 처리하도록 변경하면서 UI를 함께 수정했고, 더 다양한 이미지를 활용할 수 있도록 Unsplash 외에도 Lummi를 연동했다. Lummi.ai Lummi는 AI 기반 스톡 이미지 서비스로, Unsplash보다 전반적으로 깔끔하고 정제돼 있다. 사진, 일러스트, 3D이미지를 지원하고, 원하는 색상을 지정해 해당 색상에 맞는 이미지만 활용할 수 있어 사이트 제작 시 원하는 분위기를 맞추기 유용하다. (Pro 요금제를 사용하면 원하는 비율로 이미지를 재생성하거나, 배경 없는 PNG형식으로도 사용할 수 있음) 변경전 기존에는 업로드와 Unsplash 중 하나를 택하는 방식이었기 때문에 탭으로 나누어 제공함 변경 후 미디어 업로더 컴포넌트
애널리틱스 대시보드 디자인
Desktop Bar Chart Details Mobile
페이지 중심에서 사이트 중심으로 애널리틱스 개편
초기 사용자들은 사이트를 설정하고 몇 개의 콘텐츠를 게시한 뒤 장기간 방치하는 패턴이 있었다. 지속적인 운영을 위해서는 명확한 동기부여가 필요했다. 일부 사용자는 댓글이나 리액션이 많이 달리길 원했지만, 이는 방문자가 직접 행동해야 하는 영역이어서 서비스에서 임의로 제공하기 어려웠다. 이에 따라, 사이트 반응을 가장 직관적으로 확인할 수 있는 애널리틱스를 강화하고, 해당 지표를 눈에 잘 띄는 위치에 배치했다. 우리 서비스는 SEO 최적화가 잘 되어 있어 구글 검색을 통한 자연 유입이 활발하게 발생하는 특성이 있다. 이를 기반으로 유입 현황을 시각적으로 강조해, 콘텐츠가 외부에 미치는 효과를 사용자가 직접 인지할 수 있도록했다. 기존 애널리틱스의 문제점 사이트 단위 비교,분석이 어려운 페이지 중심 구조 사이트 단위로 콘텐츠를 운영하는 경우, 사이트의 전체 흐름을 파악하고자 하는 니즈가 자연스럽게 발생한다. 예: 이 사이트의 전체 유입은 얼마나 되는가? 어떤 페이지/포스트가 가장 많이 소비되는가? 등 하지만 기존 애널리틱스는 페이지 단위로 데이터를 보여주는 구조였기 때문에, 콘텐츠 간 성과 비교, 유입 흐름 분석처럼 사이트 전체 지표를 종합적으로 파악하기 어려웠다. 분석 단위 혼재로 지표 해석이 어려움
DM 접근 방식 개선 - 계정 기반으로 통합
초기 슬래시페이지는 각 사이트를 하나의 독립된 워크스페이스 처럼 다뤘고, DM 기능도 각 사이트의 트리 구조 안에 포함되어 있었다. 하지만 사용자들의 실제 사용 방식은 점차 더 유연하고 복합적으로 변화했다. 여러 사이트를 동시에 운영하거나, 관심 있는 사이트를 구독해 소식을 받아보는 등 다중 사이트 간을 오가며 활동하는 사용자가 많아졌고, 이에 따라 사이트 간 소통 흐름을 자연스럽게 연결할 수 있는 구조가 필요해졌다. 때문에 사이트 간을 오가며 소통하기 자연스러운 구조로 DM을 개선하고, 그동안 임시 형태로 제공되며 다소 미비했던 기능들도 함께 보완했다. 기존 DM의 문제점 알림 혼합과 접근 경로 문제 DM 알림이 일반 알림(예: 새 글, 댓글 등)과 함께 표시되어 즉각적인 대응이 어려웠다. 일정 시간이 지나면 알림센터에서 사라지고, 이후에는 메시지 확인을 위해 사용자나 사이트를 기억해 직접 찾아가야 했다. 이로 인해 메시지를 놓치거나 응답이 늦어지는 문제가 발생했다. 사이트 기반 구조로 인한 불편함 DM이 사이트 내부 트리에 위치해 있어, 다른 사이트의 메시지를 확인하려면 사이트를 변경해야 했다. 페이지 전체가 전환되는 구조였기 때문에, 메시지를 확인하는 과정에서 사용 중이던 화면과 맥락이 끊어졌다. 분산된 구조로 인한 실시간성 저하 메시지가 사이트 단위로 분산돼 있어 계정 전체 기준에서의 일괄 관리가 불가능했다. 여러 사이트를 넘나드는 사용자일수록, 커뮤니케이션 흐름이 단절되거나 누락될 가능성이 높았다. 개선 방향 및 주요 변경점
사이트 공지 배너&팝업 기능 추가
커뮤니티형 사이트를 관리하는 유저들의 '커뮤니티 이용 공지나 이벤트 공지를 하고싶다'는 요청에 따라. 특정 포스트를 Pin 하여 상단에 띠 배너로 노출할 수 있는 기능을 제공했었다. 그러나 해당 기능은 유저가 원하는 다양한 공지의 형태를 모두 대응하기엔 부족한 부분이 있었기에 기존 Pin 기능을 개선하고, 신규 기능을 추가해 더 적극적으로 공지를 안내할 수 있도록 개선했다. 기존 핀 기능의 문제점 발행된 각 포스트의 더보기 메뉴에서 해당 포스트를 ‘핀’으로 지정할 수 있다 핀된 글은 해당 글이 게시된 페이지 상단에 띠배너 형태로 노출됐다. (가장 최근 등록된 게시글이 기본으로 표시되며, 공지가 여러 개 등록된 경우에는 배너 내 핀 영역을 통해 n개의 공지를 레이어 형태로 확인할 수 있었음) 하지만 이런 형태는 여러 개의 글을 동시에 핀했을 때 접혀 있는 글을 인지하는데 어려움이 있었고, 특정 페이지에서만 노출되는 구조라 사이트 전체 공지를 전달하기에 적합하지 않았다.

Stories