Kristian Wagner
@k_wagner
Followers
1,614
Following
69
Media
23
Statuses
166
app developer, lighting enthusiast and lego nerd
Toronto
Joined July 2018
Don't wanna be here?
Send us removal request.
Explore trending content on Musk Viewer
Ronaldo
• 729090 Tweets
Portugal
• 594682 Tweets
Venezuela
• 418192 Tweets
Canadá
• 319813 Tweets
#loveislandusa
• 83141 Tweets
#SmackDown
• 69499 Tweets
Vinotinto
• 62833 Tweets
Rondón
• 46777 Tweets
Serena
• 42293 Tweets
#CopaAmerica2024
• 38007 Tweets
選挙妨害
• 37302 Tweets
Yankees
• 36395 Tweets
リンツのチョコ
• 35425 Tweets
Jana
• 34083 Tweets
Kenny
• 33128 Tweets
ボボステ
• 32469 Tweets
Self Esteem
• 25565 Tweets
Angel Reese
• 24733 Tweets
#ManoTengoFe
• 19029 Tweets
ボーボボ
• 16076 Tweets
Laura Loomer
• 15640 Tweets
Romo
• 15231 Tweets
サラダ記念日
• 13000 Tweets
ソフトン
• 12659 Tweets
#CANMNT
• 12398 Tweets
蓮舫赤軍
• 11579 Tweets
Red Sox
• 11255 Tweets
Pinned Tweet
computer
exploring a childhood memory in an interactive space, equipped with pinch, pan and click, tactile keys, and flashing vintage screen.
built with react native skia and a lot of creative gesture handling.
really want to use this for a welcome screen one day, what kind
2
2
53
mood lighting
dark modes are becoming an expected feature for many, but what if they actually brought something to the table in terms of elevating the user's experience?
very excited to slowly bring the letters app to life, one exploration at a time.
12
26
454
happy accidents. love stumbling into crazy (unintended) animations along the way.
10
20
447
dynamic spaces 🔳
exploring alternative navigation patterns with perspective. love this sense of depth, and creating "rooms" to step in and out of.
will most likely feature in the letters project 🩶
12
28
429
exploring bottom sheets.
made with a transition library I'm working on that focuses on:
- simplifying shared element transitions
- forwards AND backwards gesture compatability
- only native animations
- full access to elements on entering AND exiting screens
happy friday 🩶
6
15
356
exploring shared element transitions 🪄
beginning to get very excited about this project - starting to feel easy to compose complex screen transitions.
see great potential for this library to make aspiring design engineers comfortable with coding their ideas.
cont. ⬇️
7
21
299
gestures 🩶
final proof of concept with my take on a crowd favourite: the music player animation
made this to test out forwards gesture compatibility (going TO a screen) - see second video
officially ready to start implementing this in production apps, stay tuned
4
4
165
UIDoorController
one day, I will find a legitimate use for a door navigation.
what would you put behind door number 1?
14
10
147
day 2 of folders. its coming alive.
second photo for the nerds 🩶
6
6
138
lamp picker
a table lamp can both represent your personal aesthetic and define the mood of an entire space
What else do you want to customise at your desk?
7
8
134
vinyl
exploring perspective and movement, squeezing 3D motion into a 2D space
while everyone is focused on all the newest tech at WWDC I'm celebrating a timeless medium - the record player
4
4
65
behind the scenes
I always prefer demoing apps on device instead of using the simulator - much smoother, more tactile
to get touches and drags to show up on recordings, I have a controller nearby that is set up as a pointer device
4
4
53
build a stamp.
so many fun things going on in this little stamp editor, lots more to come.
1
0
22
heres a simplified example of how the circle transition works. The magic is in the useTransitionStyle hook, that wraps reanimated's useAnimatedStyle so you can apply animations to the following events
- focus (mounting)
- exit (unmounting)
- blur (a screen is stacked on top)
0
0
16
App navigation and movement between screens is a key part of world building. Do you want your users to experience boundaries or floating spaces? Edges or seamless transitions? I think it deserves much more focus.
1
0
13
Nerd facts
- react native but swift portable
- built on stack navigator so you get all the benefits of native screens (no messy modals)
- can easily be extended with pinch / zoom or any other gestures (might demo this?)
0
0
10
@argyleink
not convinced this is a great pattern. You end up reusing headers everywhere, lose the scanability of rows and columns, and make it difficult to compare and sort the data in a meaningful way.
1
0
8
Not everything needs to be an infinite list. Placing meaningful limitations on the user can be incredibly powerful, ultimately creating a more worthwhile digital interaction.
0
2
7
@anshnanda_
Not yet - but planning to release the entire navigation library on npm later this year
1
0
7
"every onboarding flow should feel like you are picking a starter from professor oak"
- my goal in perpetuity
0
2
11
@_darioroa
Yes it is 💯 focused on first making it compatible with react navigation and expo router
0
0
3
1
0
2
I have a record player in my office.
its my pomodoro timer.
play side A, 20-25 minutes of focused work
when side A is done, take 5 minutes to turn over record.
play side B, 20-25 minutes of focused work
rinse. repeat.
🩶
0
0
20
Multiline c̶r̶o̶s̶s̶ ̶o̶u̶t̶ animation.
Using this for a little task manager app I'm calling 'Dusty'.
#buildinginpublic
1
1
5
more years as a developer doesn't necessarily make you more senior, but it does give you a much stronger sense of intuition, perspective and (hopefully) fading imposter syndrome. time to lean in.
1
0
5
@anshnanda_
No gorham, everything is made with the same library. In my head the modals can just be treated like a view controller instead of a window based modal. Then you can stick to the same transition api for everything and get the benefit of isolating your renders in separate screens
0
0
3
@idhamarsyd
Planning to release a public package in the future where everything will be documented 🍀 will also be posting more about how it works in the coming weeks
1
0
2
@akiffpremjee
very cool. Always great to make something that has real world value for yourself. Have fun with the animations, always my favourite part.
0
0
1
Here are some of the upcoming scenes I’m working on:
- Coffee in the morning
- Toast popping
- Skylight that opens
- Weather thermometer on window
Any other good ideas? Any bad ones?
2
0
6
Often, complex navigation concepts and shared element transitions stand in the way of bringing design to real life. Why dont we change that?
Working on a library to easily build and maintain bespoke navigation layouts, without sacrificing performance or readability. Stay tuned.
1
0
4
nailing minimalism = maximum difficulty
but i am so here for the challenge
1
0
5
@soren_iverson
i mean, if you want a door im your guy 🚪
UIDoorController
one day, I will find a legitimate use for a door navigation.
what would you put behind door number 1?
14
10
147
0
0
3
@pop977s
@akiffpremjee
These days there aren’t any real performance differences in production between a bare react native project and expo. Used to think differently, but find it hard to justify not using expo these days, they have made it incredibly easy to start, and scale.
0
0
1
@pop977s
@akiffpremjee
With an expo managed project you can use expo go, and let expo do all of the heavy lifting in terms of dependency management and native linking (used to be huge pain for some packages). If you need to to use modules that aren’t managed by expo you can create a dev-client build
1
0
1
@anshnanda_
Plan is to make it very incremental so you can use the library for just one transition if needed or scaffold a whole app around it if you want.
1
0
1
@anshnanda_
Will extend the Native Stack navigator and provide some hooks so you can use it alongside Expo router / React navigation or independently.
1
0
3
Modals for an upcoming project.
Built with full customizability over rootview animations, and scrollviews play nice with all dismiss gestures.
#reactnative
#buildinpublic
0
0
3
letting a project get the time it deserves is an immense relief, and the results are spectacular.
0
0
2
@akiffpremjee
yup, reanimated. These examples are made in expo, but could just as well be in a bare react native project.
2
0
2
@onlyfootnotes
💯%. Making an expanded version where you can select the record and manually adjust the arm!
0
0
1
@arunpattnaik
not initially, but a lot of the same concepts could be ported to flutter. Skia could bridge almost everything.
0
0
0
@engineerBosatsu
Summary of how its made (using react native)
- flashlist to render the list
- reanimated to store the scrollY position
- scrollY value is passed to each list item
- when list items reach top they offset their position with translateY and scale back with interpolate function
1
0
1
@kenneth1tang
i find it really makes the polishing stage more rewarding and by knowing that you'll circle back it takes the pressure off the first days
0
0
0
@jayharr_is
appreciate that 🙏
@samdape
really hit this one out of the park. been a joy to implement.
0
0
1