Findaline
Findaline은 포트폴리오용으로 만든 메모 웹 애플리케이션입니다. PARA 메모법을 기반으로 하여, 사용자가 메모를 기록하고 정리할 수 있도록 디자인되었습니다. 또한, 기록된 메모를 효과적으로 활용할 수 있는 다양한 방안들을 고려하며 개발되었습니다.
PARA
뜬구름 잡는 일들이 많아지니 생각 정리가 어렵고 시간이 없다. 잘 알려진 메모법들과 일정 관리법들에 대해 알아봤고, PARA를 적용하기로 했다. https://www.youtube.com/watch?v=lkRQuMIbFYc PARA 시간 관리
codingbroker.tistory.com
개요
메모 애플리케이션은 크게 두 종류로 나눠 볼 수 있습니다. Notion, Evernote, Obsidian 같은 다양한 기능을 제공하는 서비스들과, Google Keep, Napkin, Simplenote 같은 심플함을 추구하는 서비스들입니다.
Findaline은 메모를 '기록하는 행위'에 있어서는 후자처럼 심플함을 유지하면서도, 기록한 콘텐츠를 '관리하고 활용'하는 측면에서는 다양한 기능을 제공하려 노력했습니다.
문득 떠오르는 생각을 메모할 때, 모두가 그 메모는 언젠가 유용하게 쓰일 것이라 기대하지만, 실제로 기록했던 메모가 생활이나 업무에 활용되는 경우는 그리 많지 않습니다. 메모 애플리케이션을 살펴보면, 왜 적었는지 의문이 드는 오래된 메모들도 종종 발견됩니다.
Findaline은 이러한 메모들이 사용자로부터 잊혀지지 않게 도와줍니다. 예를 들어, 메모에 시작 날짜나 중요도를 설정했다면, '그래프 뷰'를 통해 메모들을 손쉽게 정렬하고 한눈에 파악할 수 있습니다. 투두 리스트를 생성한 메모가 있다면, 해당 메모를 직접 찾아서 열어보지 않아도 '할 일 목록'을 통해 모든 메모에 입력된 할 일을 확인할 수 있습니다.
기능 및 화면
1. 사이드바 & 폴더 구조
로그인 후 초기 진입 화면에서는 좌측에 사이드바가 출력됩니다. 사이드바의 디자인과 구성은 Notion의 인터페이스를 벤치마킹하였습니다.
Findaline은 효율적인 메모 관리 시스템을 제공하기 위해, PARA 방법론(Projects, Areas, Resources, Archives)에 기반한 폴더 구조를 채택하고 있습니다. 애플리케이션에서는 모든 메모가 PARA 방법론에 따라 체계적으로 관리될 수 있도록, 이 네 가지 루트 폴더의 존재를 강제합니다. 따라서, 루트 폴더들은 이름을 변경하거나 삭제할 수 없으며 사용자는 각 루트 폴더 내부에서 자신만의 메모와 폴더를 자유롭게 구성할 수 있습니다.
사이드바를 확장하면 폴더 구조가 한눈에 들어오도록 펼쳐지며, 정렬을 돕는 툴바도 함께 나타납니다. 사용자는 각 속성별로 정렬하기 기능을 통해 원하는 기준에 따라 폴더를 즉시 정렬할 수 있습니다.
또한, 복잡한 폴더 구조 대신 간결한 형태를 선호하는 사용자를 위해, 메모의 중요도, 시작 날짜 등 특정 속성을 기준으로 전체 폴더 구조를 재구성할 수 있는 옵션도 제공됩니다.
2. 메모 상세정보
메모에 대한 기본 정보를 보여주며, 사용자는 여기서 메모 잠그기, 날짜 지정, 중요도 설정, 공유자 초대, 권한 조정 등 다양한 작업을 수행할 수 있습니다. 이렇게 설정된 정보들은 메모를 정렬하는 데 쓰이기도 하며, 아래에 소개할 '그래프 뷰' 화면에서 메모의 위치를 조정하는 기준이 되기도 합니다.
3. 검색 & 알림 & 설정
검색창
사용자는 사이드바 상단에 위치한 검색 버튼을 클릭하여 열리는 검색창을 통해 내 메모, 공유받은 메모, 휴지통에 있는 메모 등을 제목 기준으로 검색할 수 있습니다. 이 창의 인터페이스 역시 Notion을 벤치마킹하여 설계되었습니다. 검색 결과는 최근 업데이트 시간을 기준으로 '오늘', '어제', '1주 전', '한 달 전', '그 이전'으로 시간 순서에 따라 분류되어 표시됩니다.
알림창
사용자는 메모 공유, 권한 변경 등에 대한 실시간 알림을 알림창에서 바로 확인할 수 있습니다. 이 기능을 통해 중요한 변경 사항이나 업데이트를 놓치지 않게 됩니다.
설정창
사용자는 설정창에서 프로필 변경, 보안 옵션, 테마 선택, 계정과 관련된 개인 설정을 할 수 있습니다.
4. 텍스트 에디터
메모를 클릭하면 우측의 메인 화면에 에디터가 출력됩니다. 화면 상단에는 실시간으로 편집 중인 사용자들의 목록이 나타나며, 그 아래에는 메모 편집을 위한 WYSIWYG(What You See Is What You Get) 텍스트 에디터가 나타납니다.
'기록하는 행위'에 해당하는 텍스트 입력 및 편집 과정은 설계 의도대로 심플하면서도 직관적으로 유지하며, 사용자 경험을 최우선으로 고려했습니다.
텍스트를 선택하면 나타나는 버블 메뉴에는 텍스트 서식 설정, 이미지, 동영상, 표, 차트, 코드 블록, 할 일 목록, 링크 및 메모 링크 삽입 기능을 담았고, 마우스 우클릭으로 접근 가능한 콘텍스트 메뉴에는 삽입 메뉴와 콘텐츠 요소의 서식을 지우는 기능을 담았습니다.
5. 탭 관리
화면 상단에서는 열려 있는 메모들을 탭 형태로 편리하게 관리할 수 있습니다. 각 탭에 대해 마우스 우클릭으로 접근 가능한 콘텍스트 메뉴를 통해, 열려 있는 탭들을 쉽게 닫을 수 있습니다. 또한, Findaline은 사용자의 편의성을 극대화하기 위해 드래그 앤 드롭 기능을 전반적으로 적용하였습니다. 이를 통해 사용자는 사이드바에서 메모를 선택하여 탭 영역으로 끌어오거나, 탭 간에 메모를 옮기며, 메모 링크를 다른 문서에 쉽게 삽입할 수도 있습니다.
6. 할 일 목록 & 그래프 뷰
1-5번의 기능들이 메모 애플리케이션의 기본적인 구조를 형성한다면, '할 일 목록'과 '그래프 뷰'는 메모를 '관리하고 활용'하는 데 중점을 Findaline만의 특별한 기능입니다.
6-1. 할 일 목록
사이드바 내 '할 일 목록' 섹션을 통해, 사용자는 저장된 모든 메모의 할 일 목록을 쉽게 확인하고 정렬할 수 있습니다. 이 기능을 활용하여, 미처 관리하지 못한 투두리스트를 발견하거나, 다양한 프로젝트의 진행 상황을 한눈에 파악할 수 있습니다.
6-2. 그래프 뷰
Findaline의 그래프 뷰 화면은 Obsidian에서 영감을 받아, 에디터에서 만들어진 메모 링크들 사이의 연결을 시각적으로 보여줍니다. 사용자는 이 기능을 통해 모든 메모가 어떻게 서로 연결되어 있는지 한눈에 확인할 수 있습니다. 이러한 시각적 표현은 사용자가 메모 사이의 관계를 직관적으로 이해하고, 분산된 정보를 모아 탐색함으로써, 예상치 못한 연결점을 찾아내고 새로운 아이디어를 생성하는 데 도움을 줍니다.
그래프 뷰의 또 다른 숨은 장점은 사용자가 메모 간의 연결(참조)을 자유롭게 구성할 수 있게 해 준다는 점입니다. 가령 A메모에서 다른 폴더의 B메모를 참조하고 싶을 때, 두 메모 사이에 직접적인 연관성이 없거나 서로 다른 PARA 카테고리에 속해 있더라도, 또는 참조 대상 메모가 위치를 변경할 가능성이 있더라도, 그래프 뷰를 통해 모든 연결 관계를 한눈에 확인할 수 있기 때문에 사용자는 폴더 구조의 복잡성을 걱정할 필요 없이, 단지 '필요에 따라' 메모들을 자유롭게 연결할 수 있게 됩니다. 연결된 이후에도 메모 링크의 삭제를 통해 연결을 쉽게 해제할 수 있기 때문에 참조 작업의 부담이 없습니다.
필터링과 시뮬레이션 설정
우측 창을 통해 그래프 뷰의 세부 설정을 조정할 수 있습니다. 필터 기능을 사용하면, PARA 메모법에 따른 타입별로 노드를 선별하여 표시할 수 있습니다.
또한, 시뮬레이션 설정을 통해 노드 간의 거리를 조절하거나, 다양한 형태로 노드를 재배치하여 정보들을 새로운 관점에서 파악할 수 있습니다. 그리고 시작 날짜, 중요도 등 메모 설정에서 정의한 속성들을 바탕으로 메모를 정렬함으로써 메모의 관리와 탐색을 더욱 효율적으로 만들어 줍니다.
7. 협업 에디팅
Findaline에서는 사용자가 메모를 다른 이들과 공유하고, 필요에 따라 편집 권한을 부여할 수 있습니다. 여러 사용자가 동시에 하나의 메모를 편집할 경우, 실시간으로 내용이 업데이트되며 각 사용자의 커서 위치가 표시됩니다.
또한, 권한 수정, 잠금 상태, 삭제 여부 등 메모 편집에 영향을 미치는 모든 속성의 변경은 해당 메모를 편집 중인 사용자들에게 실시간으로 전파됩니다. 이를 통해, 특히 수정에 민감한 내용을 다루는 경우에도 메모 소유자는 언제든지 원하는 시점에 메모를 안전하게 보호할 수 있습니다.
Findaline 개발 과정에서는 사용자의 일상적인 메모 작성 경험을 향상시키고 간소화하는 데 주안점을 두었습니다. 특히, '할 일 목록'과 '그래프 뷰' 같은 기능을 통해 사용자가 메모를 보다 체계적으로 관리하고, 쉽게 참조할 수 있도록 만드는 것이 목적이었습니다. 이는 사용자가 기록한 메모를 잃어버리지 않고, 언제든지 필요한 정보를 빠르게 찾아낼 수 있게 해 줍니다. findaline은 최적화, 보안강화, UI 개선 작업과 동시에 메모 관리의 효율성을 극대화하는 신규 기능들을 지속적으로 추가할 계획입니다.
https://findaline-569d8.web.app/
Findaline
findaline-569d8.web.app
'수익형 웹사이트 만들기' 카테고리의 다른 글
| [Findaline] 기록을 찾는 기능 (0) | 2024.03.26 |
|---|---|
| [Rectify] 에디터 Beta v0.4 - 메뉴바, 반응형 (0) | 2024.02.10 |
| [Rectify] 에디터 Beta v0.3 - 콜라보레이션, 웹소켓 서버 배포 (0) | 2024.02.08 |
| [Rectify] 에디터 Beta v0.2 - 차트, 클립보드 데이터 (0) | 2024.02.07 |
| [Rectify] 에디터 Beta v0.1 - 컨텍스트 메뉴, shortcutkey, 커스텀 노드 (1) | 2024.02.02 |
