rp

Frontend ninja, UX jedi apprentice, night owl based in Vienna. Passionate about web design, HTML/CSS, JS, online marketing, typography and football.

[rp @rpdsgn]

@FynCas UGC

[Drew Brucker ん @dcbruck]

After creating over 140,000 images in Midjourney, one of the biggest lessons I've learned is that...

Three of the best ways to use storytelling in your images is to focus on:
1. Angles
2. Expressions
3. Light/Shadow

Why?

Because these all drive emotion.

Today, I scraped some of my most commonly used tokens (90+) and tried to use them to that drive emotion and compiled them into a list for you.

And I'm giving it away for free for the next 24 hours.

To get it:
→ Hit “Like”
→ Comment "Send the guide"
→ Re-post
→ & Make sure you're following (otherwise I can't DM you)

*Those who also share/re-tweet this post will get first access.
#midjourney #aiimagegeneration #promptshare #midjourneyguide

[rp @rpdsgn]

@dcbruck Send the guide

[Addy Osmani @addyosmani]

AVIF is an image format that compresses to a smaller size than WebP or JPEG https://t.co/MDDdL8tw8S It's in Chrome 85, behind a flag in Firefox & can be a progressive enhancement!

[Smashing Magazine 🇺🇦 🏳️‍🌈 @smashingmag]

Didn’t know about that one. Meet content-visibility, the new CSS property that boosts rendering performance with CSS containment — by @Una and Vladimir Levin.

https://t.co/OyaEeGxb68

[Addy Osmani @addyosmani]

Lottie is an animation library that renders Adobe After Effects animations on Web, Android and iOS: https://t.co/yCkcdFbVlt

With adaptive loading, fast connections can get a Lottie animation and slow ones can get a static image: https://t.co/WWfHYrKN1G

[rp @rpdsgn]

#webclerks is by far the coolest web conference I‘ve ever been to in Austria. Thank you @wearewebclerks team and see you next year!

[rp @rpdsgn]

Detect a touch device with only CSS by @Ferie80 https://t.co/hQy7XyYANz

[rp @rpdsgn]

Optimizing Google Fonts Performance https://t.co/7UShKt3vSB via @smashingmag

[Addy Osmani @addyosmani]

Native <img> lazy-loading is coming to the web! https://t.co/LgF7F1iMgR <img loading=lazy> defers offscreen images until the user scrolls near them. Shipping in Chrome ~75 https://t.co/4gR7lvx4zx

[rp @rpdsgn]

Finally, a CSS only solution to :hover on touchscreens by Mezo Istvan https://t.co/OLaVddvOiK

[CSS-Tricks @css]

Very cool advantages to using --custom-properties instead of $preprocessorVariables is that you can change them at media queries.

[Oscar Falmer @OscarFalmer]

📱AR Business Card Concept

I created this it using ARKit 2.0 with Image Tracking,
Could really be how we interact with business cards in the near future.

#ARKit #iOS12 #AugmentedReality

[Jen Simmons @jensimmons]

I’m proud to show you the next in series of design tools — the Firefox Shape Path Editor. Take a look: https://t.co/7dXaycRI5P

[CSS-Tricks @css]

"Generate font combinations with deep learning"

https://t.co/E7NoCt5dnx

[Una 🇺🇦 @Una]

Interesting reads on ads & the web from @NNgroup:

"Annoying Online Ads Do Cost Business"
https://t.co/u2riO9HSW0

"Banner Blindness: Users Dodge Ads on Mobile and Desktop"
https://t.co/7zN8vTtb2B

[rp @rpdsgn]

People code future #WeAreDevs

[Chris Coyier @chriscoyier]

Wrapping up "CSS Basics" week with a thing about font stacks: https://t.co/Q4H42ugVhR

[Jen Simmons @jensimmons]

In today's Layout Land video, I show you exactly how to do a super common card layout by nesting a Flexbox layout inside a Grid layout, all while thinking through accessibility — in ~50 lines of CSS, using zero media queries.

https://t.co/lMzkPHivEx

[Rachel Andrew @rachelandrew]

The Shapes Inspector in Firefox is going to be so useful! Currently in @FirefoxNightly and you need to enable support for shape-outside in about:config to see Shapes. #css