OurTodo-Unteraufgabenfunktion: Wie wir einfache Gesten verwe

Während der Entwicklung von OurTodo ist uns ein interessantes Phänomen aufgefallen: Große Aufgaben von Benutzern bleiben in der Regel so lange in der Liste, bis sie ablaufen. Warum? Denn wenn eine Aufgabe mehr als 10 Schritte umfasst, verspürt das Gehirn instinktiv Angst. Was wir brauchen, ist keine bessere To-Do-Liste, sondern ein Tool, das große Aufgaben in ausführbare Schritte „zerlegen“ kann. Dies ist unsere ursprüngliche Absicht, die Unteraufgabenfunktion zu entwickeln.

Problempunkte der Benutzer, die wir beobachtet haben

Durch Benutzerfeedback und Datenanalyse haben wir drei typische Szenarien gefunden:

Projektmanagement-Szenario: „Vorbereitung auf eine Produkteinführung“ ist eine große Aufgabe, und Benutzer wissen nicht, wo sie anfangen sollen
Lernplan-Szenario: „Learning React“ scheint unerreichbar und Benutzer geben leicht auf
Reisevorbereitungsszene: „Vorbereitung auf eine Reise nach Japan“ enthält zu viele Details und Benutzer haben Angst, sie zu verpassen

Das häufigste Problem ist: Die Aufgabe ist zu komplex und die kognitive Belastung ist zu hoch。

Unsere Designidee: kognitive Belastung reduzieren

Unser Kerndesignkonzept ist: Vage Ängste in klare Handlungsschritte umwandeln。

Warum „Nach rechts wischen“ wählen?

unter iOS Bei nativen Interaktionen ist Wischen einer der natürlichsten Vorgänge:

Wischen nach links bedeutet normalerweise „Löschen“ oder „Kein Interesse“
Wischen nach rechts bedeutet normalerweise „mehr Vorgänge“ oder „Erweitern“

Wir haben uns für Wischen nach rechts entschieden Da die Hand das Unteraufgabenpotenzial auslöst, ist der Grund sehr einfach:

Entspricht den intuitiven Gewohnheiten des Benutzers
Beeinträchtigt den Hauptprozess nicht (Aufgaben anzeigen)
Einfache Bedienung, keine Lernkosten

Technische Herausforderungen bei der Umsetzung

Bei der Implementierung dieser Funktion stehen wir vor mehreren technischen Herausforderungen:

1. Datenstrukturdesign

Task {
  id: String
  title: String
  isCompleted: Boolean
  subtasks: [Subtask]  // 子任务数组
}

Subtask {
  id: String
  title: String
  isCompleted: Boolean
  parentTaskId: String
}

Wir verwenden verschachtelte Array-Struktur anstelle der Kachelstruktur, weil:

Die Datenzuordnung ist klarer
Die Darstellung der Benutzeroberfläche ist intuitiver
Die Leistung ist besser (reduziert Datenbankabfragen)

2. Optimierung der Gestenerkennung

iOS UISwipeGestureRecognizerKonfiguration:

let swipeRight = UISwipeGestureRecognizer(target: self, action: #selector(handleSwipe))
swipeRight.direction = .right
taskCell.addGestureRecognizer(swipeRight)

Wir haben den Triggerschwellenwert der Geste angepasst um sicherzustellen, dass:

wird nicht versehentlich ausgelöst (Wischdistanz ist zu kurz)
wird nicht allzu schwer auszulösen sein (Wischdistanz ist zu lang)
taktiles Feedback sorgt für sofortige Bestätigung

3. Anzeige der UI-Hierarchie

Unteraufgaben müssen optisch deutlich von der Hauptaufgabe abgegrenzt werden:

Einrückung: Unteraufgaben werden um 20 pt nach rechts eingerückt | Dies ist wichtig, weil:
Benutzer können Schritt für Schritt erledigen
Große AufgabenJedes Mal, wenn eine Unteraufgabe erledigt ist

Ein Erfolgserlebnis

Der Fortschritt der Hauptaufgabe ist sehr intuitiv

2. Fortschrittsvisualisierung

Wir haben eine Fortschrittsanzeige auf der Benutzeroberfläche implementiert: Abgeschlossene Unteraufgaben werden angezeigtDurchgestrichen
Anzeige neben der HauptaufgabeVollständiger Fortschritt
(z. B. „3/5“)

Nachdem alle Unteraufgaben abgeschlossen sind, kann die Hauptaufgabe mit einem Klick abgeschlossen werden

3. Klare Hierarchie

Hauptaufgaben und Unteraufgaben werden visuell klar unterschieden, um Verwechslungen zu vermeiden:Hauptaufgabe: große Schriftgröße, fett, kein Einzug links
Unteraufgaben: kleine Schriftgröße, normale Schriftstärke, links eingerücktUnser Anwendungsszenario-BeispielSzenario 1: Projektmanagement
Szenario 2: Lernplan

Szenario 3: Reisevorbereitung

Unsere Leistungsoptimierung

Um einen reibungslosen Ablauf zu gewährleisten Aufgrund unserer Erfahrung mit der Unteraufgabenfunktion haben wir mehrere Leistungsoptimierungen vorgenommen:
1. Lazy Loading

Die Unteraufgabendaten werden nur dann aus der Datenbank geladen, wenn der Benutzer

die Unteraufgabe erweitert

📦 准备产品发布会
  ├─ 确定发布会日期和场地 ✅
  ├─ 准备演示 PPT（第 1 版）✅
  ├─ 录制产品演示视频
  ├─ 邀请媒体和 KOL
  ├─ 准备发布会后的社交媒体内容
  └─ 跟进参会者反馈

. Dies verkürzt die anfängliche Ladezeit erheblich.

📚 学习 React
  ├─ 学习 JSX 基础 ✅
  ├─ 掌握 State 和 Props ✅
  ├─ 理解 Hooks
  ├─ 实战小项目
  └─ 阅读官方文档

2. Lokaler Cache

✈️ 准备日本旅行
  ├─ 办理签证 ✅
  ├─ 预订机票 ✅
  ├─ 预订酒店 ✅
  ├─ 规划行程
  ├─ 购买 JR Pass
  └─ 准备随身 WiFi

Unteraufgabendaten werden in der

lokalen SQLite-Datenbank

zwischengespeichert, die auch offline angezeigt und verwaltet werden kann.

3. Inkrementelle AktualisierungWenn der Benutzer eine Unteraufgabe prüft/abbricht, wird nur der Status dieser Unteraufgabe

angezeigt aktualisiert, anstatt die gesamte Aufgabenliste neu zu laden.

Unser BenutzerfeedbackNachdem die Unteraufgabenfunktion gestartet wurde, erhielten wir viele positive Rückmeldungen: „Endlich kann ich große Aufgaben aufschlüsseln! Früher war ich überwältigt, als ich „Reisevorbereitung“ sah, aber jetzt kann ich es Schritt für Schritt erledigen, und die mentale Belastung ist viel geringer.“ —— Benutzer A

„Die Fortschrittsanzeige der Unteraufgaben ist sehr zufriedenstellend und es ist wirklich erfrischend zu sehen, wie die Punkte durchgestrichen werden.“ —— Benutzer B

„Die Wischgeste nach rechts ist so natürlich und es fallen überhaupt keine Lernkosten an.“ —— Benutzer CUnsere nächsten SchritteBasierend auf dem Feedback der Benutzer planen wir, in zukünftigen Versionen Folgendes hinzuzufügen:

Mehrstufige Unteraufgaben

: Unterstützung für Unteraufgaben von Unteraufgaben (bis zu 3 Ebenen)

Drag-and-Drop-Sortierung

: Unterstützt Drag-and-Drop zum Anpassen der Reihenfolge von Unteraufgaben

Unteraufgabenvorlagen

: Bereitstellung voreingestellter Vorlagen für gängige Szenarien (z. B. Reisevorbereitung)

Smart Erinnerungen

: Automatisches Festlegen von Erinnerungszeiten basierend auf UnteraufgabenprioritätenAm Ende geschrieben
Die Unteraufgabenfunktion ist keine schicke schwarze Technologie, aber sie löst ein wirklich großes Problem: Wie man aus „möchte tun“ in „kann tun“ und dann in „tun“ umwandelt
Wir glauben, dass das beste Werkzeug unempfindlich
sein sollte - Es lässt Sie seine Existenz nicht spüren, sondern hilft Ihnen nur im Stillen, komplexe Dinge einfacher zu machen. Wenn Sie auch „Angst vor großen Aufgaben“ haben, probieren Sie die Unteraufgabenfunktion von OurTodo aus: Schreiben Sie Ihre großen Aufgaben auf

Wischen Sie nach rechts und fügen Sie 3-5 Unteraufgaben hinzu

Konzentrieren Sie sich nur auf die erste UnteraufgabeErledigen Sie eine, markieren Sie eine und fahren Sie mit der nächsten fortSie werden feststellen:Diese scheinbar unmöglichen Aufgaben werden Schritt für Schritt gelöst. OurTodo-Unteraufgabenfunktion: Vereinfachen Sie komplexe Aufgaben, indem Sie zunächst nach rechts wischen.

把你的大任务写下来
向右滑动，添加 3-5 个子任务
只专注于第一个子任务
完成一个，勾选一个，继续下一个

你会发现：那些看起来不可能完成的任务，就这样一步步被搞定了。

OurTodo 子任务功能：把复杂任务变简单，从向右滑动开始。

OurTodo-Unteraufgabenfunktion: Wie wir einfache Gesten verwenden, um komplexe Aufgabenverwaltungsprobleme zu lösen