-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
executable file
·140 lines (133 loc) · 6.79 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v6.6.0/css/all.css">
<link rel="stylesheet" href="./css/style.css">
<title>Focus Fox Presentation</title>
</head>
<body>
<div class="top">
<header>
<h2 class="logo">Focus Fox</h2>
<div class="fox-logo">
<img src="img/Fox-Logo.png" alt="fox logo with blue background" class="foxlogo">
</div>
<ul class="nav">
<!-- <li class="navlink"><a href="#">/</a></li> -->
<li class="navlink"><a href="#">Focus Fox</a></li>
<li class="navlink"><a href="Process.html">Our Process</a></li>
<li class="navlink"><a href="OurTeam.html">Our Team</a></li>
<!-- <li class="navlink"><a href="#">/</a></li> -->
<!-- <li><i class="fa-brands fa-github"></i></li> -->
<!-- <li><i class="fa-brands fa-linkedin"></i></li> -->
</ul>
<button onclick="showHamburger()" class="burger">
<i class="fa fa-bars"></i>
</button>
</header>
</div>
<div class="text-section">
<article class="intro">
<section class="intro-section">
<h3>Our Story</h3>
</section>
<section class="foxpurpose">
<h4>Purpose</h4>
<p>Today, people who struggle with neurodivergence, trauma, or emotional blockers face an uphill battle with productivity. Traditional tools don’t address their unique needs.<br>
Focus Fox is a productivity app designed with mental wellness at its core. It combines intelligent task management with real-time emotional support to help users stay focused and overcome blockers in a personalized, trauma-informed way. As a group of devs with a variety of circumstances impacting our productivity personally, we are striving to incorporate the tools we have found lacking in other apps and services.
</p>
</section>
</article>
<article class="Problem">
<section class="prob-solving">
<h3>Problem Solving</h3>
</section>
<section class="problems">
<h4>Who Needs Focus Fox?</h4>
<p>Many of those who are neurodivergent report struggling with overwhelm dye to lack of organization, various emotional challenges that disrupt productivity, and a lack of tools offering a trauma-informed approach. </p>
</section>
<section class="audience">
<h4>Why Focus Fox?</h4>
<p>Focus Fox fills the gap by combining task management with personalized, real-time coaching that adapts to the user’s emotional state.</p>
</section>
<section class="design-process">
</article>
<article class="solution">
<section class="solution-section">
<h3>Solution Overview</h3>
</section>
<section>
<h4>Intelligent Task Organization</h4>
<p>Users start with a brain dump of tasks, which Focus Fox organizes into Must-Do, Should-Do, and Optional categories. Then, real-time adjustments are made based on the user’s emotional state.</p>
</section>
<section>
<h4>Adaptive Coaching and Check-Ins</h4>
<P>Throughout the day, users check in with their emotions, and Focus Fox adapts their focus regimen. Feeling stressed? The app suggests a quick ‘stress dump’ or a smaller task to help regain momentum. Feeling low? It may offer a motivational nudge or a simple win to build momentum.</P>
</section>
<section>
<h4>Trauma-Informed, Culturally Competent</h4>
<P>The language model is trained to recognize signs of trauma and neurodivergence, offering guidance in a compassionate, trauma-informed manner. It’s sensitive to cultural backgrounds, so all users feel understood.</P>
</section>
<section>
<h4>Personalized Recommendations</h4>
<P>Focus Fox suggests tailored breaks and focus tools based on mood—like breathing exercises for stress or task-switching for frustration—to ensure users stay productive without burnout.</P>
</section>
</article>
<article class="product">
<section class="product-section">
<h3>Our Product</h3>
</section>
<section>
<h4>Roles</h4>
<p>Within our team, we divided responsibilites based on every member's unqiue skills and interests. We had a small group of about three members break off to code our login page and connect our LLM, while others got started on figuring out the design and wireframes. Once the log-in was up and running a second group started coding the design based on the wireframe and design guide. Together we all worked to be prompt engineers for our LLM and of course bug hunting was the effort of our entire team! </p>
</section>
<section>
<h4>
<a class="foxlink" href="https://focus-fox-app.netlify.app/" target="_blank">Try Focus Fox!</a>
</h4>
<h4>Demo</h4>
<div class="video-container">
<iframe
width="600px"
height="400px"
src="https://www.youtube.com/embed/sR8jJ10IKKQ"
title="YouTube video player"
frameborder="0"
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
allowfullscreen>
</iframe>
</div>
</section>
</article>
<article class="vision">
<section class="vision-section">
<h3>Timeline</h3>
</section>
<section>
<h4>Current Goals</h4>
<p>Our goal is to create a prototype that showcases Focus Fox’s unique approach—task management meets wellness, within the time constraints of the GDI Hackathon. The MVP will show how adaptive, emotionally aware coaching can help users stay productive while honoring their mental well-being.</p>
</section>
<section>
<h4>Future Vision</h4>
<P>Our vision is for Focus Fox to be the first productivity tool that genuinely understands and supports users on both a productivity and emotional level.</P>
</section>
</article>
<article class="wrapup">
<section class="wrapup-section">
<h3>Wrap-Up</h3>
</section>
<section>
<h4>Special Thanks</h4>
<P>A special thank you to our teachers and mentors at AnnieCannons, specifically Catie Hart for her steadfast guidance and Dawn Allen for encouraging our team to become involved in this hackathon. </P>
</section>
</article>
</div>
<footer>
<img class="footer-img" src="img/header.png">
</footer>
<script src="javascript/script.js"></script>
</body>
</html>