atypicality's Issues
Restore height of radar chart in story section
At some point (since the last gh-pages) it seems to have shrunk due to CSS drift.
Test on other browsers
Strip hidden debugging helpers
- Clicking on intro text to jump to song-explorer
- Some debugging bound to contextmenu events in song-explorer
Years/decades in song-explorer controls shouldn't overflow edge of viewport
There's probably an easy CSS fix for this...
Try moving spotify embeds to prose
Fix spotify embed codes for Royals and Fancy
Verify that pinning works on mobile
It doesn't seem to work using chrome's mobile emulator, but it does work with $force_mobile = true
. I'm hoping it will turn out to work when tested on an actual mobile device.
Tweak layout of spotify players
They should be positioned directly beneath the previous card.
(Possibly inside the previous card, or in cards of their own, though on some mobile devices, the fixed 300px width of the players is greater than the current width of the cards)
Speed up polygon animations during "turn back time" section
(Could also try just making the whole scrolling scene longer, or giving it some ease-in)
Spotify embeds
Update Decade and Year Selectors in Song Explorer
Don't know how difficult this would be, but I noticed that if you select a new song from the Similar/Dissimilar/More By sections that the year/decade controls don't update with that new information. Is that manageable to add?
Second dropdown in song-explorer mobile mode for contrast song
Text of year slider in main story is kind of tiny on mobile
Fix load-font.js bugs
(Trying to load non-existent fonts like Canela etc.)
Assorted css fine-tuning
- nicer-looking cards
- decade selector font > year selector font in song-explorer
- make selectors in song-explorer look more like links/buttons
- style label elements in 'related songs' sections of song-explorer to make them stand out from songs themselves
- consider decreasing font size of card text on mobile? Currently 16px, which limits the amount of text that can fit on a line significantly
Try restyling the radar markers?
i.e. the little circles that show up on vertices of the radar chart corresponding to attributes we want to draw attention to.
I think they look a little goofy right now, but I can't put my finger on why. Maybe they're just too big? Or they might look better as a different shape, or with a different fill/border.
Circle back on title
Michael mentioned he had some reservations about using the word "atypical" in the title.
In mobile view, hide/fade sticky radar graphic until after the first card
Give year h3 headings a card-like appearance
Or at the very least, they need their background and z-index set such that they're easily readable in mobile mode.
Hide <hr> dividers on mobile (or restyle)
Right now they look weird.
Strip unused columns from csv files loaded by visualizations
Minimal subset looks like it should be:
artist,track,Year,energy,liveness,tempo,speechiness,acousticness,instrumentalness,valence,danceability,mean_energy,mean_liveness,mean_tempo,mean_speechiness,mean_acousticness,mean_instrumentalness,mean_valence,mean_danceability
Fine-tune spacing between cards
(Especially important for mobile mode)
Replace curly braces with quotation marks in intro.hbs
I'm using { and } for left and right quotation marks for now, for the sake of avoiding a lot of tedious copy-pasting.
Mobile layout: scrolling cards
Making the "scrollytelling" portion work on mobile. Lacking horizontal space to play with, we probably want cards that scroll from top-to-bottom over (or under) the radar chart.
Fill out rap example
(Currently there's a big todo right before Royals)
Clear out remaining Pudding meta tags
Fix beat detection errors
- correct tempo for example songs whose bpm is doubled or halved
- remove the notes about these errors from the copy
- add some kind of footnote disclosing this
- (maybe) rescale tempo to 0-1 based on min/max
Mobile layout: song explorer
Given space constraints, may make more sense to use dropdowns for some or all of the controls in the explorer (for decade, year, and song).
Also, hover modality for comparison won't work. Need to consider whether there's a good alternative.
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. ๐๐๐
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google โค๏ธ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.