HN user

dragongraphics

390 karma
Posts78
Comments12
View on HN
ashleynolan.co.uk 6y ago

Front-End Tooling Survey 2019 Results – 63% of devs don't check accessibility

dragongraphics
2pts0
medium.freecodecamp.org 7y ago

Take Part – 2019 Front-End Tooling Survey Has Launched

dragongraphics
1pts0
ashleynolan.co.uk 8y ago

React voted JS framework that most developers regard as essential to them

dragongraphics
2pts0
ashleynolan.co.uk 8y ago

Front-End Tooling Survey 2018 – The Results

dragongraphics
1pts0
www.surveymonkey.com 8y ago

Front-End Tooling Survey 2018

dragongraphics
1pts0
ashleynolan.co.uk 8y ago

Front-End Tooling Survey Closes This Week

dragongraphics
1pts0
developer.microsoft.com 8y ago

Microsoft Variable Fonts Demo

dragongraphics
2pts0
www.surveymonkey.com 8y ago

Front-End Development Tooling Survey

dragongraphics
2pts0
medium.freecodecamp.org 8y ago

Launching the Front-End Tooling Survey 2018

dragongraphics
1pts0
cssgrid.io 8y ago

CSS Grid – New (free) Wes Bos course has launched

dragongraphics
6pts0
ashn.uk 9y ago

Learn Node.js – New Wes Bos Training Course to Learn Node.js

dragongraphics
1pts0
www.ashleynolan.co.uk 9y ago

4,715 Developers Surveyed on the Front-End Tools They Use

dragongraphics
4pts0
ashn.uk 9y ago

The State of Front-End Tooling 2016 – Results

dragongraphics
3pts0
ashn.uk 9y ago

Front-end Development Tooling Survey

dragongraphics
47pts11
codepen.io 10y ago

Interactive Star Rating Component (CSS Only)

dragongraphics
2pts0
codepen.io 11y ago

Chill the Lion – Amazing WebGL Experiment

dragongraphics
12pts0
ashleynolan.co.uk 11y ago

A Guide to the Front-End Interview Process

dragongraphics
2pts0
dragongraphics.co.uk 11y ago

How to Get Responsive Images Fully Implemented in Microsoft Edge and Webkit

dragongraphics
1pts0
ashleynolan.co.uk 11y ago

Help to Get Picture and Srcset Fully Implemented in Microsoft Edge

dragongraphics
1pts0
ashleynolan.co.uk 11y ago

Kickoff V5 Released

dragongraphics
1pts0
news.ycombinator.com 11y ago

Ask HN: Best Pre or Post Processor Advice

dragongraphics
1pts0
www.sxswtracker.com 11y ago

Visualising the impact SXSW is having on various buzzwords on Twitter

dragongraphics
5pts1
codepen.io 11y ago

The DaftPunKonsole

dragongraphics
166pts29
codepen.io 11y ago

CSS3 Transitioning Toggle Buttons

dragongraphics
1pts0
codepen.io 11y ago

A Bunch of Funky CSS3 Toggle Buttons

dragongraphics
2pts0
ashleynolan.co.uk 11y ago

Playing around with CSS text-shadow

dragongraphics
1pts0
ashleynolan.co.uk 11y ago

Playing around with CSS text-shadow

dragongraphics
3pts0
codepen.io 11y ago

Awesome collection of CSS text-shadow and pattern effects

dragongraphics
1pts0
codepen.io 11y ago

A collection of CSS text-shadow and pattern effects

dragongraphics
2pts0
sass-guidelin.es 11y ago

Sass Guidelines – a Styleguide for writing sane, maintainable and scalable Sass

dragongraphics
5pts0

There were other areas I wanted to ask about, but I chose to keep the survey a bit more focussed – especially as it stretched to 19 questions already.

This could be something I look to include next year though if there’s interest in finding out about usage.

The site has some issues on tablets, simply as the scroll event doesn’t fire until you stop scrolling, and so the animations don’t trigger continuously like they do on desktop browsers, only when you stop scrolling. It didn’t crash when I tested it though.

Unfortunately, as it’s a side project, I didn’t have time to rectify this (using iScroll or something similar). Would like to find a solution though.

Thanks :) Think it's easy for some to forget it's a tech demo, so it isn't meant to be absolutely 'perfect', but really happy with the feedback so far.

Good idea re the curtain - it would be quite an easy port to make the animation work like that, so think I might do that at some point.

Think there are lots of possibilities around window resizing that haven't been explored yet - could make some really interesting effects...

Not a dumb question - only reason was because I wanted an excuse to play around with css animations and see how powerful they are in their current state.

SVG would probably be much more robust as a solution (as would canvas have been) - I think the demo shows more than anything that CSS3 animations need slightly more reliable support across modern browsers before they are a viable choice for doing some really nice things with them.

Thanks for the feedback - reason it's a bit buggy is mainly down to the implementation of the animation step-timing.

In Firefox, it works as you would expect, stepping through the spriting. In webkit, it's very inconsistent in how it renders, and doesn't look as polished because of this.

I've noticed the speed of the animation being effected by the resizing - like mentioned to others, will probably release a version which just shows the animations off separate to the window resizing as well to avoid this. The main reason for including reliance on media queries was to fit it into the mozilla dev derby criteria for this month.

Decent point on not knowing how big your window size is - think I'll update to include a width counter on the start screen.

Reason for the resizing down at the start is simply so only certain parts of the animation show at different times. It means I can control what width the animation is being viewed at, as otherwise I'd have to animate everything across a very large width potentially, which would be pretty time consuming, as this could be huge. Think with the feedback I've had, will release as a non media query animation as well when I get chance.

Yeh, can use resizeTo but only when you have a separate window.

Not sure if an increasing div would work. Could potentially do it as an iframe, but not sure how nicely that'd work, would have to try it out.

Think I'll release it as a separate full animation at some point - will write up how it's all put together when I do.

Only reason it's controlled with media queries is because it was an entry for this months Mozilla dev derby (which is based around media queries).

I could pretty easily modify and release as a straight up animation though with no media query control.

I explored a few options - the reason I decided to make it controlled by the user was so it didn't have to open in a new window (as you can only control the width of the window with JS in a separate window).

Thanks for the feedback though - might create a separate self-running version at some point.