Making Interactive Web using Framer Motion

June 20, 2020

82

Making Interactive Web using Framer Motion

Jogja JS talk, 20th June 2020

Sonny Lazuardi

June 20, 2020

Tweet

More Decks by Sonny Lazuardi

See All by Sonny Lazuardi

Artificial Intelligence & Design Plugin

0

300

The Story of Making Figma Plugins

4

250

UX Prototyping Tools

5

780

Clean Code in Javascript

5

500

React Native for Unified Codebase

0

310

Native Mobile App with Javascript - React Native - Code Push

0

400

Bantu Asap - SS Ceria

0

160

React Native for Mobile App Development

3

530

[Sidang] Layanan Basis Data Real Time NoSQL untuk Kolaborasi Web Audio Editor

0

210

Other Decks in Technology

See All in Technology

15 years with Rails and DDD (AI Edition)

0

170

10Xにおける品質保証活動の全体像と改善 #no_more_wait_for_test

PRO

1

180

会社紹介資料 / Sansan Company Profile

PRO

15

400k

OCI Database Management サービス詳細

oracle4engineer

PRO

1

7.3k

今日から始めるAmazon Bedrock AgentCore

4

390

Bill One 開発エンジニア紹介資料

PRO

4

17k

（金融庁共催）第4回金融データ活用チャレンジ勉強会資料

takumimukaiyama

0

120

Digitization部紹介資料

PRO

1

6.8k

MCPでつなぐElasticsearchとLLM - 深夜の障害対応を楽にしたい / Bridging Elasticsearch and LLMs with MCP

0

140

オープンウェイトのLLMリランカーを契約書で評価する / searchtechjp

3

650

月間数億レコードのアクセスログ基盤を無停止・低コストでAWS移行せよ！アプリケーションエンジニアのSREチャレンジ💪

0

790

AIと新時代を切り拓く。これからのSREとメルカリIBISの挑戦

0

690

Featured

See All Featured

Evolution of real-time – Irina Nazarova, EuRuKo, 2024

9

1.2k

Unsuck your backbone

671

58k

Measuring Dark Social's Impact On Conversion and Attribution

1

120

Breaking role norms: Why Content Design is so much more than writing copy - Taylor Woolridge

0

160

How Fast Is Fast Enough? [PerfNow 2025]

3

450

[RailsConf 2023 Opening Keynote] The Magic of Rails

31

9.9k

SEO Brein meetup: CTRL+C is not how to scale international SEO

0

2.3k

DevOps and Value Stream Thinking: Enabling flow, efficiency and business value

1

89

Utilizing Notion as your number one productivity tool

2

210

16th Malabo Montpellier Forum Presentation

PRO

0

47

The Art of Programming - Codeland 2020

57

14k

AI Search: Implications for SEO and How to Move Forward - #ShenzhenSEOConference

1

1.1k

Transcript

Framer Motion @sonnylazuardi Making Interactive Web using
Framer Motion
@sonnylazuardi
@sonnylazuardi https://mailbrew.com/mobile/
@sonnylazuardi Design Handoff The design handoff is a point in
the product development process where developers implement the finished design. In order for a handoff to be successful, a good designer-developer collaboration is vital. https://phase.com/magazine/designer-and-developer-handoff-guide/
@sonnylazuardi
Color Copy Paste
https://colorcopypaste.app
None
Background Story
@sonnylazuardi How to launch a product
@sonnylazuardi Landing Page Trend
Collaboration
Idea Sketch
Figma https://www.figma.com/community/file/848833690265282057/Color-Copy-Paste-Promotional
Development Story
@sonnylazuardi Gatsby Website
@sonnylazuardi Cursor Tracking
@sonnylazuardi Color Palette Interaction https://codesandbox.io/s/framer-motion-drag-to-reorder-b7ys7
Handoff Demo
@sonnylazuardi https://handz.design
@sonnylazuardi https://codesandbox.io/s/framer-motion-handoff-jnqqg?file=/src/App.js
@sonnylazuardi https://www.framer.com/community/
Thank You @sonnylazuardi