ββRandom character transition - cool text effect for your next projectπ₯.
ββTypewriter.js - native typewriter effect library that can add a bit of interaction to your app.
The usage can be as simple as:
const writer = new Typewriter(target, {
loop: true,
typeColor: 'blue'
})
writer
.type('A simple syntax makes it easy.')
.rest(500)
.start()
The usage can be as simple as:
const writer = new Typewriter(target, {
loop: true,
typeColor: 'blue'
})
writer
.type('A simple syntax makes it easy.')
.rest(500)
.start()
ββHave you seen that 3D photo Facebook effect?
If you ever wondered how it was implemented from engineering perspective have a π 4 min read
Pretty cool, despite the fact that you could always do that in AE with something like this, which looks way better or even download Fyuse app that can do the same effect from your phone.
Still cudos to FB, better late than neverπ€·ββοΈ
Oh yes, throwing an instant view below as wellβ‘
If you ever wondered how it was implemented from engineering perspective have a π 4 min read
Pretty cool, despite the fact that you could always do that in AE with something like this, which looks way better or even download Fyuse app that can do the same effect from your phone.
Still cudos to FB, better late than neverπ€·ββοΈ
Oh yes, throwing an instant view below as wellβ‘
Instant reading on average saves you one extra click π
Medium
How Facebook 3D Photos Work
Facebook recently rolled out a new feature, 3D Photos. This short article explains how it works under the hood.
ββIt's Friday! And it means time for some good quality stuff.
You all probably have heard of such UX technique as skeleton screens (some people refer to it as a splash screen, but its actually different).
Yep, you are right, that what Google, Linkedin, YouTube and a ton of other services is using.
There is an amazing article (which looks like a dissertation research to me).
Everything you need to know about Skeleton screens.
πΆοΈ Read time: 14 min (at least)
Main points I want to highlight:
βοΈ 60% of users think that animated skeletons are faster
βοΈ65% treat waving animation faster than pulsing one
βοΈ Majority think that left to right, slow animation results in a faster load
βοΈgradual content loading is the best and something that distinguish skeleton screens from splash screen
βοΈ If you are loading photos - good strategy is to use dominant color from the photo, rather than typical light grey design
Fo React devs - there is a decent tool that can help you save time designing it from scratch.
Have a great Friday π₯
You all probably have heard of such UX technique as skeleton screens (some people refer to it as a splash screen, but its actually different).
Yep, you are right, that what Google, Linkedin, YouTube and a ton of other services is using.
There is an amazing article (which looks like a dissertation research to me).
Everything you need to know about Skeleton screens.
πΆοΈ Read time: 14 min (at least)
Main points I want to highlight:
βοΈ 60% of users think that animated skeletons are faster
βοΈ65% treat waving animation faster than pulsing one
βοΈ Majority think that left to right, slow animation results in a faster load
βοΈgradual content loading is the best and something that distinguish skeleton screens from splash screen
βοΈ If you are loading photos - good strategy is to use dominant color from the photo, rather than typical light grey design
Fo React devs - there is a decent tool that can help you save time designing it from scratch.
Have a great Friday π₯
This media is not supported in your browser
VIEW IN TELEGRAM
And if you are here just for nice design insipration - here is a cool effect for utilising notch in iPhone X in 'pull to refresh'. Probably looks even better on Pixel 3 XL considering the sizeπ€·ββοΈ
ββFor all my subscribers, who are security maniacs - there is a service called privacy friendly alternatives to Google, that don't track you. Search, mail, youtube, maps. Want to have your life properly secured? Thats is something you will definitely like, cool list of tools and its all free.
I know you like free stuff, you welcome. Want to say thanks?π You know how to contact me.
I know you like free stuff, you welcome. Want to say thanks?π You know how to contact me.
ββTalking about design iterations. Its quite unrealistic to hit the right one from the first time π€·ββοΈ Even Instagram and Facebook couldn't get it rightπ
By the way, I got it from @perspectiveIX - one of a very few channels that pretty much replaced all of the Media & Tech websites for me. They normally base posts on facts and statistics, which I personally value a lot. Stops the guessing game.
Definitely recommend π₯
By the way, I got it from @perspectiveIX - one of a very few channels that pretty much replaced all of the Media & Tech websites for me. They normally base posts on facts and statistics, which I personally value a lot. Stops the guessing game.
Definitely recommend π₯
βοΈ Ah, this one is good. Heard something similar quite a few times. Read this to understand why adding extra stuff to HTML is not worth it or to strengthen your arguments in the next debateβ
ββSomehow clients really get excited after seeing fully animated apps. So do you π posts with design gets maximum reactions and views.
Well, what can I do, but to share more cool stuff and let you share that too. If you have a nicely animated app or a tool - share with @masant1, I will collate top 3 list and advertise here for freeπ₯
Also, one point to take from this, is that when you presenting it to clients - functionalities and backend is important, but make sure the UX is the best. This will leave the most positive impression. Pareto principle at it best (20% of effort gets you 80% of results).
Well, what can I do, but to share more cool stuff and let you share that too. If you have a nicely animated app or a tool - share with @masant1, I will collate top 3 list and advertise here for freeπ₯
Also, one point to take from this, is that when you presenting it to clients - functionalities and backend is important, but make sure the UX is the best. This will leave the most positive impression. Pareto principle at it best (20% of effort gets you 80% of results).
Wow, personally I love to hear personal stories, especially if they provide uncommon experience. Great article on why one guy left Amazon after only 5 months there.
Coders and Managers, you should read it!
π Read time: 14 min
Coders and Managers, you should read it!
π Read time: 14 min
Medium
Why I quit Amazon just 5 months after Iβve started
A promising SDE job at Amazon turned to be a stressful pain and disappointment. Amazonβββgood business, just an average place to work at.
ββWell, I had to create another channel
I found myself searching Product Hunt quite often this days. Trying to find nice, useful tools to use.
Which made me realize throwing everything in
Which is the exact reason I decided to simply create a bucket, where I will throw most of the stuff I find to have it nicely stored.
If any of you is interested or also have something to share, have a look - @coolhunt.
I have some nice UI/UX related services on PH, that I will upload soon.
I found myself searching Product Hunt quite often this days. Trying to find nice, useful tools to use.
Which made me realize throwing everything in
Saved Messages makes it unrealistic to read through.Which is the exact reason I decided to simply create a bucket, where I will throw most of the stuff I find to have it nicely stored.
If any of you is interested or also have something to share, have a look - @coolhunt.
I have some nice UI/UX related services on PH, that I will upload soon.
How to create a cool web performance case study on Medium
βοΈ Write everything in React
βοΈ Ensure the main landing page is also in React
βοΈ Think a bit
βοΈ Rewrite the landing page in Vanilla JS
βοΈ Track the performance difference
βοΈ Tell people that TTI decreased by 50%
βοΈ Don't forget to mention that server side is still in React
βοΈ PROFIT π€·ββοΈ
Jokes aside, Netflix rewrote their landing in plain JS and fetched React in the background. Seems that it was a good decision looking solely at the stats.
π Read time: 7 min
βοΈ Write everything in React
βοΈ Ensure the main landing page is also in React
βοΈ Think a bit
βοΈ Rewrite the landing page in Vanilla JS
βοΈ Track the performance difference
βοΈ Tell people that TTI decreased by 50%
βοΈ Don't forget to mention that server side is still in React
βοΈ PROFIT π€·ββοΈ
Jokes aside, Netflix rewrote their landing in plain JS and fetched React in the background. Seems that it was a good decision looking solely at the stats.
π Read time: 7 min
Medium
A Netflix Web Performance Case Study
Improving Time-To-Interactive for Netflix.com on Desktop
The State JS - The State of The Web
The guy is an engineering manager at Google Chrome and has a deep understanding of JS + how it evolved over the years
The guy is an engineering manager at Google Chrome and has a deep understanding of JS + how it evolved over the years
YouTube
The State of JavaScript - The State of the Web
Rick speaks with Addy Osmani about the state of JavaScript. Addy is an Engineering Manager on the Google Chrome team, and he has been a web developer for 17 years. He has a deep understanding of JavaScript, as it is today and how itβs changed over the yearsβ¦
Figma designs can be animated with Principle now
Import/Export between the two apps and add life (animating content) to the mockup.
π Read time: 3 min
Import/Export between the two apps and add life (animating content) to the mockup.
π Read time: 3 min
GraphQL: A success story for PayPal Checkout - well explained article from Paypal engineers on how they introduced GraphQL in their stack.
π Read time: 6 min
π Read time: 6 min
Medium
GraphQL: A success story for PayPal Checkout
GraphQL as a complete game changer to the way we build apps at PayPal.
ββLet's step aside from coding for a bit and answer yourself the following mental task.
'Imagine that you have decided to see a movie where admission is $10 per ticket. As you enter the theater, you discover that you have lost a $10 bill. Would you still pay $10 for a ticket to the movie?'
πYes
πNo
I ll explain later where such post is coming from
'Imagine that you have decided to see a movie where admission is $10 per ticket. As you enter the theater, you discover that you have lost a $10 bill. Would you still pay $10 for a ticket to the movie?'
πYes
πNo
I ll explain later where such post is coming from
ββThe result from the previous question is exactly as predicted.
This is explained by something known as Mental Accounting matters. In fact, if the question was a bit rephrased in a form that you loose a ticket itself, not the 10$ bill - your perception might have been different.
Full explanation:
Richard Thaler, a behavioral economist, was the first economist to fully explore the consequences of mental accounting. Although the value of the loss is the same in both scenarios, only 46% said they would buy another movie ticket when they lost their original one. This in comparision to 88% who lost their $10 bill. Buying a second ticket would make the movie seem too expensive, since it now cost $20 in their mind. The loss of cash is not taken into the mental account of the movie. We tend to treat our dollars very differently.
Read more here
Thought that this psychological trait can be also useful in your entrepreneurial activities (wether IT related or not).
Meanwhile, @coolhunt where I initially shared this project on hacking your brains, got 300+ subs without really advertising it much. If you haven't joined yet - there are pretty cool projects there on UX, valuating business ideas and potential product hunt stuff that is worth your attention.
This is explained by something known as Mental Accounting matters. In fact, if the question was a bit rephrased in a form that you loose a ticket itself, not the 10$ bill - your perception might have been different.
Full explanation:
Richard Thaler, a behavioral economist, was the first economist to fully explore the consequences of mental accounting. Although the value of the loss is the same in both scenarios, only 46% said they would buy another movie ticket when they lost their original one. This in comparision to 88% who lost their $10 bill. Buying a second ticket would make the movie seem too expensive, since it now cost $20 in their mind. The loss of cash is not taken into the mental account of the movie. We tend to treat our dollars very differently.
Read more here
Thought that this psychological trait can be also useful in your entrepreneurial activities (wether IT related or not).
Meanwhile, @coolhunt where I initially shared this project on hacking your brains, got 300+ subs without really advertising it much. If you haven't joined yet - there are pretty cool projects there on UX, valuating business ideas and potential product hunt stuff that is worth your attention.
This media is not supported in your browser
VIEW IN TELEGRAM
Book App UI π₯ There is nothing else needed to be said here.