Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
28 changes: 16 additions & 12 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,21 +1,23 @@
# DigitalBoneBox : A Web-Based Study Tool for Human Anatomy

This project is a Web App project aims to convert an existing PowerPoint-based educational tool into an interactive, mobile-friendly web application.

## How / why did we get here?
## How / why did we get here?

This project is based on the work of Prof. Brian Elliott, created during his final years of education.
In the human anatomy class, students must purchase a bone set to study the bones of the human body,
but they are not allowed to take these models out of the lab. Prof. Elliott observed that this
This project is based on the work of Prof. Brian Elliott, created during his final years of education.
In the human anatomy class, students must purchase a bone set to study the bones of the human body,
but they are not allowed to take these models out of the lab. Prof. Elliott observed that this
restriction could cause inconvenience for students who want to quickly review the bones before an exam. To address this, he created a PowerPoint presentation that includes images of the bones taken from different angles (with permission from the department), and he annotated these images to highlight the various bones in the set using different colors and filters. He utilized all available features to create an easily accessible presentation that students could use for quick revision or brief study sessions before tests.

However, he wanted to make this resource even more accessible. He envisioned offering students a
platform they could access on their iPads, or laptops—devices commonly used by students. This is
where the web application comes in. It is designed to be a quick and easy guide for students to use
for exams, to quiz themselves on essential knowledge, or to learn from material that is simple and
provides an overview of the human bones. This application is based on the information in the
However, he wanted to make this resource even more accessible. He envisioned offering students a
platform they could access on their iPads, or laptops—devices commonly used by students. This is
where the web application comes in. It is designed to be a quick and easy guide for students to use
for exams, to quiz themselves on essential knowledge, or to learn from material that is simple and
provides an overview of the human bones. This application is based on the information in the
presentations created by Prof. Brian Elliott.

## Tech Stack

This project was developed using the following technologies:

Node.js: Used for server-side development to handle requests and serve the application.
Expand All @@ -24,21 +26,23 @@ HTMX: A lightweight JavaScript library for enhancing interactivity by allowing p
CSS: For styling and layout of the web pages to ensure a clean and responsive design for users across devices.

## Features

Interactive and accessible web application for students to study human anatomy.
Quick revision tool with annotated images of bones.
Designed for use on iPads, laptops, or other devices commonly used by students.

- **Toggle Sidebar**:
- A collapsible sidebar that enhances navigation within the app.
- Includes **placeholder options** such as **Search**, **Contact**, **Recent**, and **Help**, which are non-functional and reserved for future implementation.
- Users can open and close the sidebar using the ☰ button on the top-left corner of the page.



## Setup

Clone the repository:

- git clone [https://github.com/oss-slu/DigitalBonesBox.git](https://github.com/oss-slu/DigitalBonesBox.git)
- Open the project in your preferred code editor.

## Contributing
Contributions are welcome! Check out the CONTRIBUTING.md for guidelines.

Contributions are welcome! Check out the CONTRIBUTING.md for guidelines.
Loading
Loading