Sign In

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 최적화가 잘 되어 있어 구글 검색을 통한 자연 유입이 활발하게 발생하는 특성이 있다. 이를 기반으로 유입 현황을 시각적으로 강조해, 콘텐츠가 외부에 미치는 효과를 사용자가 직접 인지할 수 있도록했다. 기존 애널리틱스의 문제점 사이트 단위 비교,분석이 어려운 페이지 중심 구조 사이트 단위로 콘텐츠를 운영하는 경우, 사이트의 전체 흐름을 파악하고자 하는 니즈가 자연스럽게 발생한다. 예: 이 사이트의 전체 유입은 얼마나 되는가? 어떤 페이지/포스트가 가장 많이 소비되는가? 등 하지만 기존 애널리틱스는 페이지 단위로 데이터를 보여주는 구조였기 때문에, 콘텐츠 간 성과 비교, 유입 흐름 분석처럼 사이트 전체 지표를 종합적으로 파악하기 어려웠다. 분석 단위 혼재로 지표 해석이 어려움
사이트 공지 배너&팝업 기능 추가
커뮤니티형 사이트를 관리하는 유저들의 '커뮤니티 이용 공지나 이벤트 공지를 하고싶다'는 요청에 따라. 특정 포스트를 Pin 하여 상단에 띠 배너로 노출할 수 있는 기능을 제공했었다. 그러나 해당 기능은 유저가 원하는 다양한 공지의 형태를 모두 대응하기엔 부족한 부분이 있었기에 기존 Pin 기능을 개선하고, 신규 기능을 추가해 더 적극적으로 공지를 안내할 수 있도록 개선했다. 기존 핀 기능의 문제점 발행된 각 포스트의 더보기 메뉴에서 해당 포스트를 ‘핀’으로 지정할 수 있다 핀된 글은 해당 글이 게시된 페이지 상단에 띠배너 형태로 노출됐다. (가장 최근 등록된 게시글이 기본으로 표시되며, 공지가 여러 개 등록된 경우에는 배너 내 핀 영역을 통해 n개의 공지를 레이어 형태로 확인할 수 있었음) 하지만 이런 형태는 여러 개의 글을 동시에 핀했을 때 접혀 있는 글을 인지하는데 어려움이 있었고, 특정 페이지에서만 노출되는 구조라 사이트 전체 공지를 전달하기에 적합하지 않았다.
활성화된 서비스를 위한 홈 화면 및 구조 개선
슬래시페이지는 단순히 일방향적인 홈페이지,랜딩페이지를 만드는 사이트 빌더가 아니라, 양질의 콘텐츠를 업로드하고 받아볼 수 있는 사이트 구축을 지향하고 있는데, 기존 홈 화면에서는 이러한 방향성이 충분히 드러나지 않았다. 초기 홈 화면은 사용자의 사이트 리스트를 단순히 나열하는 구조였다. 당시에는 '커뮤니티'보다는 '내 사이트를 만들고 관리하세요'에 가까운 이용 흐름을 가정하고 있었기 때문에, 기존 웹 빌더나 툴처럼 사용자가 자신이 만든 프로젝트를 쉽게 식별할수 있도록 단순 리스트 형태로 홈을 구성했었다. 그러나 점차 '개인 사이트 제작' 중심에서, 사이트를 기반으로 '양방향 소통과 커뮤니티 제작' 중심으로 서비스가 발전해 나가면서, 기존 리스트 형태로는 사이트별 활동성과 변화를 충분히 전달하기 어려운 한계가 드러났다. 이에 따라 사용자가 첫 화면에서 사이트의 변화와 활동을 바로 인지할 수 있도록, 홈 화면과 메뉴 구조를 개선했다. 1. 새 글 피드 추가 및 메뉴 구조 변경 Before 새로운 소식을 확인하려면 알림센터나 사이트 내부로 진입해야 했음 After 알림센터나 사이트 내부로 이동하지 않고, 첫 화면에서 주요 업데이트를 바로 인지할 수 있도록 개선 새 글 알림을 피드 형태의 별도 화면으로 제공 새 글 피드 첫 번째 메뉴(홈 화면)에 배치
더 자유로운 커스터마이징을 위한 데이터베이스 레이아웃 추가
슬래시페이지의 데이터베이스는 단순히 워크플로우 데이터를 정리를 넘어, 채팅,피드, 블로그등의 커뮤니티형 레이아웃을 지원하며, 지속적으로 컨텐츠를 발행하는 주요 사용자층은 이러한 데이터베이스 기능을 적극적으로 활용하고 있습니다. 초기에는 개인 노트나 간단한 페이지 제작에 활용되는 경우가 많아 커스터마이징 요청이 크지 않았습니다. 그러나 슬래시페이지가 점차 ‘공개 사이트를 위한 공간’이라는 방향성을 강조하면서, 색상·배치·너비 등 디자인 요소를 조정해 사이트를 브랜딩하려는 사용자 요청도 함께 증가했습니다. 주요 변경점 데이터베이스 페이지 너비 커스텀 기존에는 노트 타입에서만 가능했던 페이지 최대 너비 조정 기능을, 이제 모든 데이터베이스 타입에서도 설정할 수 있습니다. 레이아웃 변경 옵션 추가

Stories