Back to projects
3 min read

Wrytio

Developer & UX/UI Designer for Wrytio, a writing tracking tool.

Wrytio On Browser and Phone

The Wrytio project was conceived as a comprehensive platform for tracking and gaining insights into writing habits over time across multiple projects. As the sole contributor, I took charge of the UI and UX design, planning, coding, development, and testing of this tool, with the goal of creating a practical and user-friendly writing tracker for creative and professional writers alike.

Features:

  • Multi-Project Tracking: Wrytio allows users to manage multiple writing projects simultaneously, providing an organized way to track progress across different goals and deadlines.

  • Word Count and Deadline Management: The app calculates how many words users need to write each day in order to meet project deadlines, giving clear indicators for daily targets to help users stay on track.

  • Progress Visualization: Users can visualize their writing progress over time through interactive graphs. The dashboard includes customizable charts showing cumulative word counts, word count goals, and project timelines, offering a dynamic overview of writing habits.

  • Firebase Cloud Storage & Authentication: All data is stored securely in the cloud using Firebase, accessible only after logging in via GitHub, Facebook, Google, or traditional email/password authentication. This ensures that each user’s writing data is private and backed up in real-time.

  • Data Export: Users have the option to export all their writing data for offline use or further analysis, enhancing flexibility and user control over their data.

  • Customizable Themes and Goals: Wrytio supports both light and dark modes, allowing users to choose their preferred interface for different writing environments. Additionally, users can set a custom word count goal, which is reflected on the dashboard graph, giving them control over their writing target and providing feedback based off all of their progress across their projects.

Tech Stack:

  • Firebase: For authentication and real-time cloud storage.
  • React: To build the app’s user interface and manage component state efficiently.
  • JavaScript: To handle app interactivity and data flow.
  • TailwindCSS: For rapid UI development and design customization.
  • Vite: To optimize the development process and ensure fast loading times.

Learning Outcomes:

Through developing Wrytio, I deepened my understanding of full-stack development, particularly how to integrate Firebase with front-end tools like React, JavaScript, and TailwindCSS. I gained valuable experience in user authentication, cloud storage, and creating interactive data visualizations, all while ensuring an intuitive and appealing user interface.

Future Directions:

Wrytio has provided a strong foundation for continued enhancement. Future improvements may include adding support for collaboration features, expanding data analysis capabilities, and exploring additional frameworks or technologies to improve performance and scalability. I am excited to continue refining this tool to help users better track their writing progress and goals.

Note: If you’d like more information, a small case study of the Wrytio User Interface development is available here.