DEV Community

Build A Cool Thing (Street Fighter Website)

ann lin on October 29, 2018

DEMO (You can see it live here.) Today nostalgia hit me hard, so I did a video on my first cool thing. Googled for a Street Fighter sp...
Collapse
 
darlingtonp4 profile image
Eldarlin

That's pretty cool

Collapse
 
annlin profile image
ann lin

😳 Thanks :)

Collapse
 
robsongap profile image
Robson Alves

Congratulations with very good, my favorite game.
Great job.

Collapse
 
annlin profile image
ann lin

thanksssssss

Collapse
 
matthieupetel profile image
Matthieu PΓ©tel

Nice :) The backwards animation is clever!
But instead of making a call to a .svg image for the screen pixels effect, you can simply use a repeating linear background.
Ex : background: repeating-linear-gradient(rgba(0, 0, 0, .2), rgba(0, 0, 0, .2) 2px, transparent 2px, transparent 4px)

Collapse
 
annlin profile image
ann lin

yes yes this is definitely a better approach. :) Gonna update mine

Collapse
 
giacomosorbi profile image
Giacomo Sorbi

Plot twist, to animate it, you actually need to type correctly the Konami code!

[I know SF is a franchise from CapCom, that is the joke]

Collapse
 
annlin profile image
ann lin

omg that's actually a brilliant idea 😱[haha]

Collapse
 
giacomosorbi profile image
Giacomo Sorbi

And also a little fun algorithmic/basic JS problem my students seem to enjoy: go for it and let me know how nice it comes ;)

Collapse
 
pejantantangguh profile image
Herman Ng

Amazing!
Looks Awesome!

Collapse
 
annlin profile image
ann lin

<3 thanks!

Collapse
 
araslanove profile image
Araslanov Eugene

Ohh. I thought you wrote a game for the web B)

Collapse
 
solutus profile image
Staskov Sergey

@araslanove , what is your favorite game?

Collapse
 
annlin profile image
ann lin

ah ha, that's the plan.

Collapse
 
rmsim profile image
Rui Min, Sim

I'm a huge fan of the TwilioQuest site as well, this is lovely!

Collapse
 
annlin profile image
ann lin

yes! they are amazing! <3

Collapse
 
napoleon039 profile image
Nihar Raote

Looks awesome! The loading animation looks too cool πŸ™Œ

Collapse
 
annlin profile image
ann lin

woohoo thanks! πŸ™Œ

Collapse
 
migben profile image
Miguel Ben • Edited

Cool stuff! and please do moar.

Collapse
 
annlin profile image
ann lin

i will do moar 😏