BC TECH

Saved by @jacobhtml

Steve Schoger
@steveschoger 4 years, 2 months ago 687 views

Save to PDF Share See On Twitter

How to make a "Briefcase" icon in @figmadesign.

🧵 thread 👇

In a 24 x 24 pixel artboard, use the rectangle tool (R) to draw a 18 x 10 pixel rectangle positioned horizontally centered and 6 pixels from the top of the artboard.

Using the ellipse tool (O), draw a 96 x 96 pixel circle and align the top to the center/top of the rectangle. Select both shapes and use the boolean tool to intersect the group.

Using the ellipse tool (O), draw a 48 x 48 pixel circle and align the bottom to the center/bottom of the rectangle. Select both shapes and use the boolean tool to intersect the group.

Flatten the shape (command + E) and double click it to make it editable. Select the top left and right points and give them a 2 pixel corner radius. Select the bottom left and right points and give them a 1 pixel corner radius.

Using the rectangle shape tool (R), draw a 16 x 10 pixel rectangle positioned horizontally centered and make the bottom 3 pixels from the bottom of the artboard.

Using the ellipse tool (O), draw a 96 x 96 pixel circle and align the bottom to the center/bottom of the rectangle. Select both shapes and cut them using the intersect boolean group tool.

Flatten the shape (command + E) and double click it to make it editable. Select the bottom left and right points and give them a 2 pixel corner radius.

Select both shapes and convert them to a centered stroke and flatten them together (command + E). Using the pen tool (P), add 2 points where the shapes intersect (zoom in if the pen isn’t snapping into position).

Delete the overlapping lines.

Double click the shape to make it editable so you can add connecting points. Use the pen tool (P) to manually draw the handle connected to the top. I made it ~3 x 8 pixels. Give the points a 2 pixel corner radius.

To create the dot button, draw a rectangle and manually adjust the size to 0.01 and give it a stroke.

Flatten the layers (command + E) and adjust the stroke to your desired radius/width (Rounded/1.5 pixel stroke shown below).

TA DA 👏🏻

More from Tech

Matthew Panzarino
@panzer

New iPad Pro has Face ID, thinner bezels, squared off edges. A new touch sensitive Pencil that magnetically attaches to the edges. Thin enough to have a camera bump. Uses the XR's LCD cornering techniques.

The new 12.9" iPad Pro is physically smaller than the old one with the same screen size. It's roughly the same size as an 8.5 x 11 piece of paper. 5.9mm thick.

10 billion transistors in the A12X. 8-core CPU. 7-Core GPU. 35% faster single-core performance. 1000x faster GPU. iPad Pro is Xbox One S class GPU performance in "94% smaller" package, Ternus jokes.

Apple's silicon team is just dropping bombs every event.

live shot of Apple's silicon team

iPad Pro gets USB-C for up to 5K external displays and enables charging out to iPhones. Wild.

Nicolas
@necolas

A brief analysis and comparison of the CSS for Twitter's PWA vs Twitter's legacy desktop website. The difference is dramatic and I'll touch on some reasons why.

Legacy site *downloads* ~630 KB CSS per theme and writing direction.

6,769 rules
9,252 selectors
16.7k declarations
3,370 unique declarations
44 media queries
36 unique colors
50 unique background colors
46 unique font sizes
39 unique z-indices

https://t.co/qyl4Bt1i5x

PWA *incrementally generates* ~30 KB CSS that handles all themes and writing directions.

735 rules
740 selectors
757 declarations
730 unique declarations
0 media queries
11 unique colors
32 unique background colors
15 unique font sizes
7 unique z-indices

https://t.co/w7oNG5KUkJ

The legacy site's CSS is what happens when hundreds of people directly write CSS over many years. Specificity wars, redundancy, a house of cards that can't be fixed. The result is extremely inefficient and error-prone styling that punishes users and developers.

The PWA's CSS is generated on-demand by a JS framework that manages styles and outputs "atomic CSS". The framework can enforce strict constraints and perform optimisations, which is why the CSS is so much smaller and safer. Style conflicts and unbounded CSS growth are avoided.

Advertisement

Simon DeDeo
@SimonDeDeo

So, today, for the first time in 25 (!) years of Apple, I downgraded. From the 2016 MacBook Pro to my 2013, which I had kept in a drawer...

It was pretty simple to do—Apple Time Machine backups let me do it with one click.

That first tweet captures, in two pictures, how badly Apple has “lost the plot” (to quote @wylieprof). On the right is the Apple MagSafe adapter, from 2013. On the left, what I had “upgraded” to.

Thanks, Apple! I really was nostalgic for worrying about yanking my computer off the table.

Oh and I really appreciated not knowing if my computer was charging. What was great was the little whoop sound you used, so that the speaker before me could be informed I was charging my laptop.

Knarf
@Knarf93

@zkat__ I'm in the position that I actually find npm / yarn the best ecosystem. Whenever I use something else I always end up stubbing my toe into something thats missing / feels wrong.

Ex. Cargo seems to neither have a concept of devDependencies nor peerDependencies.

I also can't understand why it wouldn't have an "add" command to add a new dependency. And I'm no fan of Toml, json is greate (easy to parse and build tooling around), and the better option in my opinion would be json5.

C / C++ seems to just not have language package managers. The linux / bsd crowd seem to have decided that the system package manager also should be the language package manager. Which might have been fine if every Linux distro used the same system package manager.

Instead we end up with a N x M problem. Where we have a bunch of different operating systems and they all support multiple system package managers. So there's no easy way of distributing, referencing and updating C / C++ packages.

It is also my opinion that the compiler / runtime should be a package dependency. I don't like Rust's split between rustup and cargo (they should have been one tool). Similarly it would be better if you added Node as a dependency to package.json, that way we wouldn't need NVM.

James Felton
@JimMFelton

The Phantom of Heilbronn (or how for 16 years the German police hunted a serial killer who didn't exist)

(Thread, non sweary version here: https://t.co/iDOIhaFgIT)

Between the years of 1993 and 2009, police in Heilbronn, Germany were tracking just about the most elusive serial killer since Ted Cruz.

Known as the Phantom of Heilbronn, or occasionally The Woman Without A Face, she was implicated in so many crimes that the police eventually put out a reward of €300,000 for any information leading to her arrest.

The case that brought her to the media's attention and earned her two ridiculously badass nicknames

(honestly, if you don't want people to do murders you're going to have to come up with less glamorous nicknames - what's wrong with Jack Shitshispants or the Zodiac Cuck)

You May Also Like

Alex Oluwatobi
@alexlobaloba

According to psychologists, there are four types of intelligence:

- Intelligence Quotient (IQ)
- Emotional Quotient (EQ)
- Social Quotient (SQ)
- Adversity Quotient (AQ)

1. IQ is the measure of one's ability to comprehend, solve maths; memorize things & recall subject matters.

2. EQ is the measure of your ability to maintain peace with others; keep to time; be responsible; be honest; respect boundaries; be humble, genuine, and considerate.

3. SQ is the measure of one's ability to build a network of friends & maintain it over a long period of time.

4. AQ is the measure of your ability to go through a rough patch in life and come out without losing your mind. It is a new paradigm and can be used to determine who will give up in face of troubles and may abandon their families.

Now to the very interesting & analytical part👇

People that have higher EQ & SQ tend to go further in life than those with high IQ but low EQ &SQ.

Most schools capitalize on improving IQ level while EQ & SQ are played down.

A man of high IQ can end up being employed by a man of high EQ & SQ even though he has an average IQ.

Your EQ represents your character; your SQ represents your charisma. Give in to habits that will improve these three Qs but more especially your EQ and SQ.

EQ and SQ make one manage better than the other.

Try not only to have a higher IQ but also to have higher EQ and SQ.

$Elon Musk\u2019s Meme \U0001f171\ufe0fot$

Elon Musk’s Meme 🅱️ot...
@theMemesBot

Thats a gg, Satan

Advertisement

Eric
@ericbahn

1/ Recently, I learned about the concept of ‘struggle porn’. This refers to the fetish of sacrificing nearly everything (health, relationships, time) for your startup. I fear that this label is creating more harm than good.

2/ @nateliason wrote a fabulous article about this topic, which first introduced me to this concept. Everyone should read it:

3/ @alexisohanian also recently spoke about struggle porn, though referring to it as ‘hustle porn.’ (as the co-founder of @hustlefundvc, obviously I take issue with this pejorative definition of ‘hustle’, but that’s another topic)

4/ Struggling in itself isn’t necessarily bad. Let’s be real here--if you’re going to start a startup, you will struggle. Founders should expect to work harder generally than employees. You will be challenged in many ways and also be super rewarded in others. This is normal.

5/ However, if you are over-indexing on hard work without clear purpose and degrading your mental health/relationships in the process--then this is very bad and we obviously should not celebrate this behavior.

Simon DeDeo
@SimonDeDeo

Donna Strickland, one of this year's Nobel Laureates, was not considered "notable enough" for Wikipedia as late as this May—reported by a number of sites, including the Independent. I dug into this a little. Here's the data—

This is the first deletion, back in 2014. A bit hard to read between the lines, but the basic story that an admin had Stickland's page "speedy deleted"—i.e., deleted without debate. The method was something called Copyright Jujitsu.

In particular, the admin had the page deleted not because of notability, but because it included a photograph of Strickland that had ambiguous copyright status. This is a method that people developed to get rid of content they didn't want, but also didn't want to debate.

"Copyright Jujitsu" because it is usually used against spam from companies; a PR officer uploads promotional material to Wikipedia. Instead of debating whether it's neutral, the admin can say "we'd love to have it, but the material appears to violate your company's copyright".

Usually the PR office and the IP office are separate in a company, and the idea of releasing promotional material under public domain is such a legal nightmare that the PR person goes away.

$Danielle \U0001f1e7\U0001f1f4$

Danielle 🇧🇴...
@dinkydani21

❤✈️🌎 2 years ago today @JamesIvings and I sold all our belongings and left the UK to travel for a year. We've never been happier and we have no plans to ever return there 🙂

Thread 👇

Since then we've started a remote web dev company @SquarecatWebDev and been lucky enough to have completed several freelance projects 💻 that have kept us on the road.

In the last few months we've become a huge part of this amazing new Maker community and have found so many new friends from @makerskitchen, @women_make_ and several others! 🥰

We love travelling together (even if I'm only a glorified laptop watcher 😒) but we're both much happier being able to share our ideas outside of our own little bubble and our products have benefitted too!

Here's to another year of nomading with my favourite person and to the Maker community continuing to grow with our help! Maybe one day we'll all get to meet each other ✌️ 💛