NOTES.md

TODO - A list of todos

TODOS ongoing

• On talks -> hard link the ahref via the actual venue name specified (needs a key for this, not in the seperate links object)

• resize some of the photos to center image on me (TAMPA CC)

ABOUT ME

• Use the Kentcdodds style footer and subscriber bleed in, remove all the social icons to the very bottom
• Remove this lazy-fountain image and use the terse version of kentcdodd's about me page.

HOME PAGE

• Do away with VT logo possibly, Tania's style of subscribe maybe? I'd rather have a cool animation on the frontpage, something ASMR related (sun/moon, something really slow moving..... kind of like my gif logo header, gears? windvanes with css tricks? gear icons would look cooler... they spin too - fits my thematics - i build things - SVG logos - possibly make it a gear laptop icon? - Gear.......put profile pic in a gear icon? Or... a weathervane? Circle themed?

• ^ maybe something like the profile pic... when you scroll up, put a background pattern of my profile pic that spins too (stars... on a slow lapsed time shot... slowly spinning around). Or maybe, my profile pic changes when you scroll around? Maybe these streaks are hidden... until you scroll up only

• Or maybe when they hit homepage... yeah ASMR related. Gifs? how about Canvas paper shreds like... envylabs? (background image too?)

SPEAKING

• Add a bit more information like the topic.

• Dump one of my profile pics there, so people know they are on the right page

• Add React Modals to each item spanning the full width of the text area, there will be embedded content here (e.g. youtube video). This should reduce bandwidth usage unless people really want to look at it, possibly use a caching strat.

• Don't keep links... I think. Rather click to "view more".

• Redo my youtube profile... just move everything google to vincentntang

• Put a tania filterable list of items... to this speaking list. These speaking lists... should have tags by topic me thinks. Keep the 3 order style as I have currently. Order in chronological by default

• These modals..

  • need query parameters. If you click on the frontpage... it should transition load to this page (CSS transitiongroups?) - and after 1 second, load up the modal (even cooler if the modal opens up like Davidk's position technique)
  • This modal, you can click left/right buttons. To go to different pages.
  • (After I made projects to do) - I think the devpost hackathon format... is a good way to go for here.
    • No wait... carousels cannot work here. Because we have arrows left/right on this modal
    • It needs to be a thumbnail gallery of images, but if I add lightbox support, a user clicking off should disable only the first thumbnail
      • This means there needs to be a seperate layer div element on top of modal, this gets targeted first z-index
      • Or maybe... does the user really need to expand this thumbnail? Gatsby.. is already post processing it to smallest resolution
      • I believe... the thumbnail photos... similar to an ecommerce site instead. A carousel, webstaurant style, but keep it devpost related. Yeah that sounds good, no left/right arrows used, just a bottom preview image
        • But now the problem here is image payload is too big

PROJECTS

• Like speaking... do the same thing. Except, do devpost hackathon style, I can pin my favorites to the front of the list... show a star icon. Have favorites enabled by default.... Also... show the number of star counts on github.
• I think the styles... may be different than speaking. Possibly sdegutis style, using circular icons. It needs to be identifiable... at a glance that these are projects
  • My solution ... is to not have a single profile pic of myself anywhere here. Images are the differentiator. For things like the fullstack IoT project... put a picture of the actual prototype.... seeing what the thing looks like is cooler imo , gameplay footage preview of sorts. Possibly put the team logo icon at topright
• In the modal...
  • do whatever. Copy devpost's carousel style exactly? First item... is the video itself. Next screens are images. Copy the "How I built it links whatever etc.

Any other improvements...

• Architect UI transition group, I dig the CSS transition group property on each page. I want to add that too
• "Subscribe for newsletter" animate.css from kentcdodds. I'm using a sticky navbar, but it seems like it'd work poorly with stickynav. Perhaps... if i did away with stickynav, I could also add a css-tricks weathervane icon.... (make it a laptop, with a GEAR inside of it? too much info for such a small space?)
• What about a cool gitlabs logo? Tanuki? Highlighting over differtent parts of the svg. Heck, why not have a gitlabs style SVG that also rotates? Gears... could do that too. Are there better logos I can use?
  • Or if I removed the stickynavbar from tania's site, should I go kentcdodds on profile pic instead?

Removing sticky...consequences:

• If I remove the sticky, nightmode will no longer be an option
• I get the subscribe letter, it doesn't conflict with space on screen
• User can read more content at a time
• If I remove sticky, my options are bit greater for layout, I can do kentcdodd's style approach to layout
• swyx -> his new style is a bit bigger on screen

Other thoughts

• swyx -> not really my writing style I think, - too unfiltered like reddit. I prefer kentcdodds style