[Landing page of HabitualBe]
| Contents | Title |
|---|---|
| 1 | About Project and about Erikka |
| 2 | Features |
| 3 | App Flow |
| 4 | Challenges |
| 5 | Tech Stack |
| 6 | Use At Home |
| 7 | Hosting |
| 8 | HabitualBe v2 |
| 9 | Thank You's |
VISIT HERE: (http://habitualbedemo.com)
Check my 2-min demo video! HabitualBe 2-min Demo
Habitual be, also called invariant be, is the use of an uninflected "be" in Black and Caribbean English to mark habitual or extended actions in place of the Standard English "is" and "are".
My web app, HabitualBe, enables users to discover Black art both visually and via audio guided tours, and favorite them and the museums and collections they come from.
It is my hope that other ethnic groups create repositories that are similar...for ethnographic research and for accurate and unique "from the horse's mouth" portrayal. A less-personable version of my discovery app is Google Arts & Culture.
-
As a museum-frequenter, I want access to a repo of museum locations, museum-specific audio guides, and curated related sounds so that my solo visits are fully immersive and more impactful. -
As an art observer, I'd value having my own account, favoriting art, collections, related sounds, and museums and seeing them all in one place for later reference. -
As an art curator, I want to view a list of Black museums nation-wide, collections in these museums, and related content. -
As an artist, I want all these app features!
[Login]
[View your patron profile with all your user data and favorited collections, museums, art and sounds!].
[View HabitualBe and partner museum's collections].
[View indivivual collection details]
[You can't even get close to the Mona Lisa. Here, you can view individual art objects up close and personal]
[List of about 70 or so Black and African museums in U.S. who have web addresses; sourced from data dump here that I filtered and cleaned]
[View museum's address and web URL and related sounds, audio guides and more]
...the favoriting feature: One of the major blockers I was able to overcome happened in the refinement stage. My users were unable to create, delete, or update their favorite museum, collection, audio, and art on the app.
In my code, I used the JavaScript language to send "requests" (think of these as little favors the browser wants the web app to complete successfully upon mouse-click) to my server-side code (aka the "backend" because it happens in the database part of my app that only I see).
It involves setting up an API endpoint (this is like a special door that the favors can go through to get to the backend part of the app) on the server (my server file that I wrote in Python that is) that your client-side code (the "frontend" in-browser activity) can send requests to, using a protocol such as HTTP.
Upon investigation and consulting with others, I discovered that the JavaScript API setup was not correctly committing the favoriting action to the database for logged-in users. However, with persistence, I was able to properly configure the button and persist the in-browser favoriting action to the backend using AJAX requests. This allowed the web page to update asynchronously without the need for refreshing, which improved the user experience.
...relating all this data: I faced a challenge related to data retrieval and linking the different resources in my 10-table (data tables that hold user info, art info, collection info etc!) full-stack web app. To overcome this issue, I used object-relational mapping provided by SQLAlchemy to create relationships between the data using their special SQLAlchemy relationship variables.
After querying the data, I had to loop through a significant amount of content to display it on the client-side. While relating five main entities, I realized the complexity and breadth of my ambitious 10-table database. This reinforced my need for multiple join and associative tables in my model.
Overall, I used PostgreSQL, SQLAlchemy, and Python with Flask to create a complex database schema and a full-stack web application. Using ORM simplified the data retrieval and linking process for me.
Flask framework for my server, SqlAlchemy to use SQL with Python, Python language to power my server, Jinja templating for Python-esque syntax to render my HTML docs, PostgreSQL open source relational database so that all my data can be interconnected , Git for local repo, Github for remote repo, Psycopg2 as a PostgreSQL database adapter for Python
Creative: HTML for my page templates, Vanilla Javascript to power DOM manipulation and browser interactivity, CSS for styling, Bootstrap5 framework
If you wish to use my web app as a template for your own ethnographic museum directory for a accurate and unique "from the horse's mouth" portrayal, feel free to do so! I just ask that you tag/credit my github in your repo!
git clone https://github.com/erikkaincolor/museum-app-hackbright-final.gitCreate a virtual environment to install requirements
$ virtualenv
$ source env/bin/activateInstall dependencies in the requirements.txt file
pip3 install -r requirements.txtpython3 server.pyOpen http://localhost:5005 to start playing around!
Coming soon! I’m hosting my Flask app on AWS cloud server and I picked up some handy UNIX shell commands along the way!
[Man observing art intently, Marvel Studios]
-ARIA for accessibility
-populate audio guides based on geo fencing using users location
-Implement tests (unit tests, integration tests) for possible API usage and full-site usability for mobile
-leverage more open source museum and related audio info from the web and centralize it for broader art discovery
-peppering salting and hashing passwords in the case of hackers, db leaks, sql injections and angry museum admin employees
-I want access to an audio guide standardization proposal and mockup
A thousand thank yous to my instructors Katrina Huber-Juma, Adam Moss and our TA Katarzyna! Also to my cohortmates for checking in during project time and listening to me practice my video demo and making sure my app walkthrough was natural and user-centered. Also to the many product managers and former Hackbright women engineers who responded to my dm's, let me hold info interviews with them on Zoom and checked in with me thoughout the months ! Namely L. Quesada, V. Lorya, K. Wilks, M. Phaunef, G. Lazareva, and S. Gomez!