Recreating the Google logo using just circles and rectangles!

3,564
2
12
"It’s still all ones and zeros!" We got inspired by this article on Quora (https://www.quora.com/How-could-Googles-new-logo-be-only-305-bytes-while-its-old-logo-is-14-000-bytes) that talks about the Google logo and how it consists of circles and rectangles. So we set off to validate this inside Proto.io (https://proto.io). Proto.io is particularly strong for it’s interactive UI Libraries but it’s web based editor also offers great support for basic shapes like ovals, lines and rectangles. So we recreated the Google logo using only rectangles and circles and what do you know! It all checks out! Having done all this in Proto.io that it also known for it’s pretty neat animation capabilities, we went a step further and created a cool animation that shows how it’s all done. For even more fun you can even import it in your own Proto.io account and edit it! Enjoy!

Alexis Odysseos

Get the position of a scrolling container

4,261
2
114
If you need to get the Y position of a vertically scrolling container, create a text box. Then on the container scroll trigger, set a variable that evaluates the numerical callback value from the event (Y position). Then add a callback that changes the text property of the text box by reading from the variable.

Todd Siegel

Jeans

1,140
0

The Design Owl

1,867
0
8
Visitanos http://thedesignowlm.com/

f661d548-504c-11ed 9221-0e76797a4f7b

Hideez v.2

1,367
0
Prototype for mobile app setup

a31f1bdf-504e-11ed 9221-0e76797a4f7b

ToFind

4,796
1
139
A Proto.io recreation of the transitions used in Leo Leung’s design: ToFind https://dribbble.com/search?q=Leo+Leung

71ffbe0d-9b82-11f0 ad7f-0e3ec7c5f8cf

Bungee jump animation with custom easings

3,190
0
Say hello to our brand new visual easings manager! This project was created using custom easings and more specifically cubic bezier.

71ffbe0d-9b82-11f0 ad7f-0e3ec7c5f8cf

Next