2018/Baltimore/prettywebsites

From IndieWeb
Jump to: navigation, search

Pretty Websites was a session at IndieWebCamp Baltimore 2018.

Notes archived from: https://etherpad.indieweb.org/prettywebsites


IndieWebCamp Baltimore 2018

Session: Pretty Websites

When: 2018-01-20 16:00

Participants

  • derekfields.is
  • Eddie Hinkle
  • russelheimlich.com
  • Matt Griffin

Notes

derekfields.is: if you hover over the profile photo, you'll see the rounded borders shift around.

codrops contains some different styles that you can do to your websites: https://tympanus.net/codrops/ Some examples we looked at:

Derek shared some research regarding performance hits for doing this work -- things have changed given modern browser performance:

  • CSS animations can be less CPU intensive rather than, say, js animation: developers.google.com/
  • Csstriggers.com - helps to define what things get triggered with different css properties
  • codepen.io --> has some great resources to draw from; Eddie shared that he solved his confetti for new years feature from inspecting some ideas at codepen.io
  • wolfenstein3D in email example from codepen: https://codepen.io/M_J_Robbins/pen/XpQZOG

Cloth demo https://codepen.io/thomcc/pen/NGQpxv Tearable cloth demo https://codepen.io/dissimulate/pen/KrAwx

https://aframe.io/ - framework for making web-based openGL 3d and VR experiences

Discussing the differences between CSS and JavaScript with something like https://p5js.org

Great routes to get started with new approaches to CSS3 :

Discussed the benfits of simple effects, like the languge transition on GitHub Repo pages: https://github.com/brentsimmons/Evergreen

Russell shared a simple elegant use of CSS3 - theincline.com Eddie shared a few light touches in Michael Bishop's page: https://miklb.com/

Debated the importance of Augmented Reality/Virtual Reality versus the Web. One important consideration being the difference between raising a device to view something and just seeing something like through a google glass like device.

See Also