This is a read-only archive of the Framer Community on Facebook.

What is Framer? Join the Community
Return to index
JinJu Jang
Posted Jan 24 - Read on Facebook

Hi, everyone!

I've been sharing Framer prototypes along learning Maths. I wrote a story about how I started learning mathematics again. (I was bad and hated maths, lol) almost every example in this post is made with Framer.

Please check it out if you are interested in. :) Thanks!

18 Comments

Drew Stock

This is awesome

Sadok Cervantes Rabadan

Incredible!

Tim Kjær Lange

Brilliant! ヾ(-_- )ゞ

JinJu Jang

Oh! FYI The cover art is not my work :/ (It just picked the first image, which wasn't my work!) --> Check out Marius Watz if you love his style though :D

Jordan Robert Dobson

This is great!

I've been doing something very similar with Josh Rule... picking it up again after holidays. But it's sooooooooo valuable.

Javier Eduardo Treviño

very interesting article, I'm going to a similar process myself. What are your favorite environments to draw with code?

Andrew Nalband

Fantastic

Camile Custodio Orillaneda

Great story

Jon Stulich

From the article:

"As an ambitious university student, I tried my best to replicate the style — without understanding anything that looked scary. Such as sin(blah blah) or cos(blah blah)."

You should have tried using tan(blah blah). LOL.

Tan functions can create interesting results where curves, particles, etc. fly off the top of the screen and reappear from the bottom (due to how a tan function curve is graphed)

http://mathworld.wolfram.com/images/eps-gif/Tangent_701.gif

"Trigonometry had been the worst of the maths in my life."

If you can understand how trig functions are represented in terms of curves, you can create some really interesting visuals, especially continuous cyclic functions such as sin and cos.

Perhaps more students would find trig interesting if visualizations based on trig functions were demonstrated in math classes instead of the typical dry math lectures. Then again, that would assume that the math teachers understood how to create such visualizations i.e. knew how to program and apply / express math concepts through programming.

Here's another resource for those interested in applying math visually, especially to CG (computer graphics):

https://www.3dbuzz.com/training/bundle/mathematics-bundle-volumes-iiii

Javier Eduardo Treviño

all of this is really great. I'd like to see it in more apps or websites as part of the UI or the experience.

Minjong Lee

I was in the same thought process and was going to re-study math! Excited to read the article about the experience. :)

Koen Bok

Great article! Ashanya can help featuring this on our blog if you like!

Jon Stulich

Another good site for math notes is Paul's Notes:

Definitely take a look at the Trig section since trig functions will be most applicable to translating trig graphs and functions to visuals.

http://tutorial.math.lamar.edu/Extras/AlgebraTrigReview/AlgebraTrigIntro.aspx

http://tutorial.math.lamar.edu/Extras/AlgebraTrigReview/TrigGraphs.aspx

Paul's Notes Trig Cheat Sheet:

http://tutorial.math.lamar.edu/getfile.aspx?file=B,32,N

Jon Stulich

And also take a look at the Desmos Calculator to help you visualize how trig functions are graphed:

https://www.desmos.com/calculator

Try putting in the following functions:

* 6 main trig functions:

sinx or sin(x)

( What's nice is that the calculator understands both ways of writing these i.e. sinx or adding the parenthesis (x) and writing it as sin(x) )

cosx

tanx

1/sinx or cscx

(both of these will generate the same curve for cosecant x)

1/cosx or secx

1/tanx or cotx

* "Arc" functions or inverse trig functions:

arcsinx

arccosx

arctanx

arccotx

arcsecx

arccscx

* Hyperbolic functions:

sinhx

coshx

tanhx

cschx

sechx

cothx

* And the "arc" or inverse hyperbolic functions:

arcsinhx

arccoshx

arctanhx

arccschx

arcsechx

arccothx

You can add different functions in the calculator and hide functions in the left column buttons to compare graphs.

Really useful tool !

Explore, have fun, and try translating these functions to your code : )

Jon Stulich

Lastly, if you really want to go in depth there is Wolfram MathWorld:

http://mathworld.wolfram.com/topics/TrigonometricFunctions.html

And Wolfram Alpha:

https://www.wolframalpha.com/

Which also functions a math search engine.

Wolfram also creates the software Mathematica.

http://www.wolfram.com/mathematica/

Very good for in depth math knowledge !

JinJu Jang

OMG thank you Jon Stulich!

German Bauer

Brilliant!

Wonjun Song

nice one! this inspires me as well.

Read the entire post on Facebook