History Lens
🚀 Inspiration
Inspired by the need to make history more accessible and engaging through innovative technology.
📖 What it does
History Lens allows users to explore historical topics through an interactive search feature, providing summarized content and links to full articles.
🛠️ How we built it
The project was built using:
- HTML for structuring the content
- CSS for styling and layout
- JavaScript for interactive functionality
- GSAP for advanced animations and transitions
- APIs like the Wikipedia API for fetching historical information
⚙️ Challenges we ran into
Some challenges included handling API requests efficiently, ensuring a responsive design, and creating an engaging user interface.
🏆 Accomplishments that we're proud of
Successfully implemented a user-friendly interface that provides quick access to historical information and offers a seamless experience.
📚 What we learned
Gained experience in frontend development, API integration, GSAP for animations, and the importance of user experience in web applications.
🔮 What's next for History Lens
Future plans include expanding features, such as adding user accounts for personalized content and incorporating more interactive elements to enhance learning.
🚀 How to Run the Project
- Unzip the project folder to access all files.
- Open the index.html file in your browser to launch the application.
📂 Project Structure
- index.html – Main HTML file for the landing page.
- style.css – CSS file for landing page styling.
- script/script.js – JavaScript file for landing page interactions, including GSAP animations.
- media/ – Contains all images and videos used in the project.
- fonts/ – Includes font files for styling text.
- books/, history/, ar/ – Separate folders for additional features, each containing their own code.
Enjoy exploring history with History Lens!
Built With
- api
- css
- gsap
- html
- javascript
- tailwind
- vanilla
- wikipedia
Log in or sign up for Devpost to join the conversation.