ufosc / bytesoflovewebsite

A website for the OSC Visual Novel

Bytes Of Website

Welcome to the website for Bytes of Love!

This website allows players to learn about what Bytes of Love is and get a download of the current game for FREE!

Website Link

To see the website, navigate to this link: bytesoflove.net

How to Run Locally

If you'd like to run the website locally on your machine, follow these steps:

1. Fork the Repository
   Start by forking the repository to your own GitHub account.

2. Clone Your Fork
   Clone the forked repository to your local machine:

   git clone https://github.com/<your-username>/BytesOfLoveWebsite.git

3. Navigate to the Directory
   Change to the directory of the cloned repository:

   cd BytesOfLoveWebsite

4. Install Dependencies
   Install all required npm packages:

   npm install

5. Start the Server
   Start the website locally:

   npm start

After running this command, the website should be accessible via http://localhost:3000 or another port specified in the console.

Credits

Created by: Wilson Goins, Anton Salvador, Xael Font, Edward Roshko, Ryder Keeny, Nicolas Valiente, and Tyra Passion.

Thank you for visiting the Bytes of Love website!

bytesoflovewebsite's Issues

Redesign Nabar

The Navbar we currently have is functional, but the team agrees it is missing "something".

Redesign the Navbar component so that it still features the Open Source Club logo and clickable links to the 3 different pages.

This should be done by changing Navbar.js and Navbar.css.

Redesign the Download Page

Update Download Page for BytesOfLove Website

Description

Currently, the Download page only contains "How To Play" and three download links. We need to update this page to provide more information about how the game is run, including details about the engine used (Ren'Py) and other relevant information.

Current Content

• How To Play
• Link 1
• Link 2
• Link 3

Proposed Changes

• Include information about the engine used (Ren'Py) and its role in the game.
• Add more content to this page and make it look nice

Game Engine

BytesOfLove is built using Ren'Py, a popular visual novel engine. Ren'Py allows for rich storytelling experiences through its easy-to-use scripting language and powerful features.

How to Play

(Existing content about how to play the game)

Download Links

• Download for Windows
• Download for Mac
• Download for Linux

Steps to Update

1. Update the Download page content to include the suggested content above.
2. Ensure all links are functional and point to the correct resources.
3. Review the changes with the team before deploying.

Notes

You can add more description and make the download page look nicer at your own discretion, just keep us in the loop in the bytes-of-website channel in the OSC discord!

Add Longer Description to Home

Currently nowhere on the website there is a good description of what the game is. We need to add this and make the home page look nicer. You can get the description from the main GitHub repository https://github.com/ufosc/VisualNovel

Fix Download Links

The buttons to download the game currently only work on Windows. All three links are the same, so if Mac or Linux users try to download the game it will say it is not compatible with their system.

So the links for Mac and Linux download buttons need to be fixed. Changes to the code need to be made wherever these buttons appear which is in Home.js and Download.js

Mobile Banner Mobile View

Currently the main home page picture looks weirdly distorted on mobile view.

If someone could fix the css to change to make it look better on mobile view that would be nice.

Convert operating system text and download buttons to dynamic sizing

The text which displays the operating system option (Mac, Linux, or Windows), as well as the clickable button which says 'Download' are a consistent size no matter what the viewport height and width are. As a result, these elements do not resize when the screen size is changed.

Please change this so that the text size and the size of the buttons are relative to either vh (viewport height) or vw (viewport width).

This change will likely be implemented by the creation and assignment of CSS classes to these elements. These changes needs to be made in Home.js and Download.js.

About Page Mobile View

Description:
The contributor page, titled "About" (found in src/About/About.js) needs improvements to ensure it is fully responsive.

Tasks:

1. Ensure the page is more responsive across different screen sizes.
2. Fix the issue where pictures should all stay the same size regardless of the screen size.
3. Address the overflow issue so that all contributors display correctly when resizing the page.

Testing:
Please test the responsiveness using Google Chrome's inspect element feature, specifically in mobile view, to ensure everything appears as expected.

Expected Outcome:

• The page should look good and function well on all screen sizes.
• Pictures should maintain a consistent size.
• Overflow should be handled properly so that all contributors are displayed correctly without any weird formatting issues.
• Please also test on Firefox if possible

Example of Error:

Thanks!