In our initial discussions about IRCO and a platform that could assist their mission, we were most interested in solving their accessibility problem. Because their users speak many different languages, could be illiterate and may have little experience with technology, communicating information about the Sun Schools online is a challenge. How can IRCO share their services and locations with those that need them?
To create a simple, text-light and visually friendly responsive website to help end users with a wide range of home language skills and literacy levels access IRCO's vast network of services. We were driven by a desire to connect people to the most revelant information for them in the simplest way possible.
What it does
Using this focus on accessibility, we designed and developed a web application for users interested in looking up information about the Sun Schools. Our landing page begins with a simple, streamlined onboarding questionaire. Questions are split between different pages to simplify each selection. Throughout the website we've matched text with images to express ideas without (potentially hard to read) words.
Onboarding questionaire: Choose a language --> Choose a School (or not!) --> Choose interests
Using the onboarding questionaire, we generate a home page for the user.
- If they've chosen a school, the home page contains information (events, hours, etc.)
- If they've haven't chosen a school, the home page contains a map showing possible Sun School locations. Once a user selects a school, the information for that school shows up on the home page.
How we built it
We started project using VanillaJS with a light dependencies on bootstrap and jQuery. At first we thought about using the Google Maps API, but a suggestion was made to use the leaflet library. We started using a collaborative web development website called codesandbox.io. About halfway into the project codesandbox.io started crashing. We decided to use a template suggested by a different team member. It is an open source template with responsive layout.
For the frontend, we used Vanilla JS with a slight dependency on jquery and bootstrap.
Challenges we ran into
Accomplishments that we're proud of
What we learned
What's next for IRCO Sun Schools
- Customized resources provided based on user's family SUN school and/or interests
- Filtering IRCO associated sites on map based on interests selected
- Text translated based on language selected on landing page
- Authentication and user management to store preferences
- More code inline annotation to foster maintenance of the code base by SUN students