Project Info
Inspiration
While at the CalHacks venue, a team member, Jeffrey, took a picture of the city buildings and wondered, "How can we capture the vibe of this picture?". The team had previously wanted to work on an AI and music-related project, so we got to work in trying to successfully capture the VibeS.
What it does
Provided a picture and a Spotify account, the application will provide a curated playlist that captures the VibeS of the picture based on the user's preferences.
How we built it
We trained a visual transformer BEIT from Hugging Face using Intel's Cloud Computing services that categorizes pictures. Using some of these categories, we then fetch from a Convex database populated with the user's songs from his "niche" playlists and provide the top results.
Challenges we ran into
Making a dataset for the visual transformer was challenging as well as learning new technologies like Convex database mutation and querying.
Accomplishments we're proud of
We are proud of building accurate models for the time of the day and environment classifications. We are also proud of being able to build an appealing front end for our project.
What we learned
We learned a lot of skills such as training and testing models using Hugging Face and Intel's Cloud Computing Services, using Convex for database mutations and queries, fetching user information using Spotify's API, and getting more comfortable building in TypeScript and React.
What's next
More data, more classifications for images, and more features such as instantly adding a playlist to Spotify, linking results to Spotify song links, etc.
Analysis
View
Metric
- 2
- 1
- 1
Figures cover GitHub contributors during the hackathon window. A co-authored commit counts in full for each author, so per-member totals add up to more than the whole-team figures.
Technology
- CSSIn code
- HTMLIn code
- JavaScriptIn code
- ReactIn code
- Tailwind CSSIn code
- TypeScriptIn code
- Hugging FaceClaimed
6 of 7 appear in the indexed code. 1 claimed on Devpost could not be matched to code, which may simply mean the tool leaves no trace in the repository.
AI coding agents
No AI coding agent signals were found in this repository.
Detected from committed agent config files and commit authorship. Absence of a signal is not proof an agent was unused.
Codebase size
Source size
50 KB
Source files
34
Counts recognized source files only; vendored directories, binaries and lockfiles are excluded, so this is smaller than the repository on disk.
Repository
luisricardodiaz/VibeS
59 files · 36.7 MB · @ 2847c51
Structure
Interface
9 files · 15%Screens, components and styles rendered to the user.
Application logic
26 files · 44%Domain rules, services and shared utilities.
Supporting
Layers are inferred from where files sit in the tree, not from reading the code. A project that names its directories unconventionally will read oddly here — open the file browser to check anything the diagram implies.
Languages
- JavaScript45%
- TypeScript38%
- CSS11%
- Markdown5%
- HTML1%
Share of indexed source by file size. Binary and vendored files are excluded.
Dependencies
package.json
npm · 39- @hookform/resolvers
- @radix-ui/react-checkbox
- @radix-ui/react-icons
- @radix-ui/react-label
- @radix-ui/react-slot
- @types/node
- @uiball/loaders
- @xixixao/uploadstuff
- axios
- bootstrap
- class-variance-authority
- clsx
- cmdk
- convex
- date-fns
- react
- react-bootstrap
- react-day-picker
- +21 more
Declared in the repository’s manifests at the indexed commit. A declared package is not proof it is used, and runtime dependencies are listed first.
This project’s features have not been analysed yet.
Export this project's context (description, README, evidence, key source files) to chat with an AI agent elsewhere.