Person: Check out this “savage” file!

Me: Huh?

Person: *Shows SVG file*

🙄

My Company paid a designer for a svg graphic. This is what we got:

Svg. Ever heard of it?

Made a little program to draw svg images on an oscilloscope using XY mode. Heres tux!

My new treasure. I'm excited to dive into.

.svg is a work of god.

Thank lord I love .svg

Every single diagramming tool.

All the SaaS ones are either way too limited in function, or proprietary vendor-locked.

All the FOSS/desktop ones have a 90s UX experience.

I really want to make a great, comfortable-to-use diagramming tool which just directly uses SVG as the file format, but without the "FUCK IT DOESNT ALIGN CORRECTLY AND WHY IS THIS ARROW BEHIND THE REST" experience...

But I know deep down that it's hard work, and I'll probably get stuck delivering the gazillionth lackluster, bugged diagramming app.

Shrank the size a logo from 794kb to 5,27kb.
This was purely done to push my ego.

Svg files don't work with Edge
*facepalm*

Fuck post-it notes.

Oh look, another product manager found his inner child and plastered a wall with a colored arts and crafts project.

Don't misunderstand me, I'm abso-fucking-lutely in favor of connecting with your deep childish nature -- but then at least enter the meeting room like a boss, armed with some creative ideas, really get to work with some fingerpaint, modelling clay, glitter, molly, acid blotters and grape juice for the whole party.

Not only was that project poorly thought out. Not only does the assortment of colored squares contribute nothing to the clarification of ideas. The issue is also that by Monday morning, the meeting room will look like a strip club after an escalated party, floor littered with 60 little neon pink and green slips reeking of desperation, cheap glue and failure.

Now your whole project is on the floor.

OH DIGITAL WHITEBOARD YOU SAY. NOW WE HAVE 10 MANAGERS FIGHTING DIGITALLY OVER VIRTUAL POST-ITS, ON A CLOUD SERVICE COSTING $500/MONTH.

Product managers, just go fuck yourself, I don't care about your kindergarten bullshit processes.

Call me when you manage to pull a workable idea out of your ass, and just draw an SVG diagram with Inkscape, or write your brainfarts into a nicely organized Markdown file.

When you ask the design team to provide you with a svg of an image, and they give you an svg with a png inside it...

So far all designers I worked with do the following:
1. Use "creativity" to come up with stuff that the system does not allow implementing, for example: Changing clock color in mobile statusbar to Blue!
2. Use "creativity" to come up with a heavily customized calendar for a windows software which requires building the control from scratch, but they explain their creativity by saying: Can't you use CSS?
3. Provide iOS only design which follows android guidelines and refuse to provide android styles for at least pages that to be handled differently on each platform, for example, we had a checkout page in an app, and they wanted the same style for both WITHOUT building custom control for it, they said: Can't you use the android custom control inside iOS
4. They design for a website and send same mockups for me to implement on mobile apps, the problem is a web page runs on a big screen when the mobile app doesn't have room for half the stuff they designed but they must look exactly the same as website !!
5. They send entire PSD with no color codes and say: You can extract icons, and colors from psd ... When they should provide them as per our request which is: SVG for Android and PDF for iOS with the color codes, but no, they are lazy!
6. They ask the team to create a page in the app which is almost production ready just so that they test different font sizes and see how it will look on the phone
7. Same as #6 for images that contain text

The list goes on, but those are by the far the ones that made me one step away from resigning, some of them made me resign...

This just came in, hyped!

Spent ages (at least 10 minutes) trying to get svg to load using <img /> tag. Checked for browser support, checked for format of svg and how it was imported. All seemed fine.

Finally realised I had spelt src as scr...

No prior knowledge on svg. Somehow Built this animated svg using React components 😼

Can someone please build an SVG vector file format equivalent that uses json instead of xml? k thnx! 😆

This is the source code of our logo in SVG. Just how fucking beautiful it is

Developers to designers be like...

I Googled "png to svg converter", this is the output of the first online tool I tried.

This dev literally just a base64 encoded copy of my origin image wrapped in an svg... the most infuriating thing about it is that technically it did 'convert' it to svg - just not in the way I had anticipated.

Whoever wrote this is a lazy genius (and a dickhead).

When you accidentally thought Vue JS is Vivus JS and argue why would you need a SVG animator to compare with React. JS naming. God.

It is sooooo pleasant to work with .svg assets ☺️

Me to customer: I need that image in either svg or png format.

Customer sends a zipped .docx file containing nothing but an image.

You know you're a developer when on your machine an ".svg" file automatically opens in a texteditor...

Do not recommend. Pretty basic shit...

Client wondering why svg icons doesn't render properly. They put a fucking base64 png in a. Svg.
Damn

Building a website using Wordpress and Visual Composer for a client is pretty easy, right?!

Until the clients wants to change one of the icons to sofa “you can’t use image, and visual composer has a list of only 5 icon libraries and none of them has a fucking sofa icon”.

Manager says just do it today!
Ok no problem.. just had to figure how visual composer communicate with the libraries to show them in the module area, edit the function, create the font/svg files for the new icon, edit the css file of one of the libraries to add the icon. And boom its working fine!

No tutorial about this stuff so had to figure it out by reading the code and see how they did it so I can do it.

After finishing this, they just gave me few more changes as I have done nothing.

Thank you

i cant stand these idiots anymore. My instructor needed 12 Minutes to understand Megabyte and Mebibyte. He just used the snipping tool to save an SVG from Wikipedia. My instructor is an Person who wrote small Programs in the past and thought that an instructor license is something useful. It hurts listening to him. he was kept busy for hours because of nothing, so we could only twiddle our thumbs. our first instructor went probably because of the Management.
At the beginning of June I will give my lecture for my final exam.
I am fucked.

As I already said on devrant, I'm a freelance web developer and I also often sell my services for teaching, loving that. Currently I'm teaching PHP with 30 students and it's going very well.

But yesterday, I received an offer for giving another course next month, this time on HTML and CSS, for a company I don't know yet. Almost every line of this email is wrong, outdated by 20 years, or just basically meaningless...

So I thought I could do my best to translate this as close as possible to the original, preserving the wrong formulations too, just for you devranters fellas.

"Hello,

I have an offer for a 2 days course for 5 people (level 1+ and/or 2), on HTML5 and CSS3. Below, the program :

1. XHTML AND CSS2 INTRODUCTION

Advantages and benefits of change

Understanding compatibility for different versions of browsers

HTML, XHTML, CSS edition tools : presentation of the different tools

The CSS language : different types of selectors : class of selector, identifier of selector, contextual selectors, grouped selectors

Blocks of text, boxes of text

The CSS1, CSSP, CSS2 properties

Relative and absolute measures units

2. LAYOUT TECHNIQUES

Full CSS, XHTML websites demo

Positioning with the position property, positioning with the float property

Columns creation

Layout for forms

Layout for data tables

Layout for menus

3. INTRODUCTION TO SVG (SCALABLE VECTOR GRAPHICS)

Role and importance of SVG

Using SVG on client side : basic shapes

SVG structure of document, tags examples

Using CSS styles with SVG

Different integration methods for SVG in a XHTML document

4. OPTIMISATION OF JAVASCRIPT CODE

Introduction to DOM and Javascript

Access to document objects : different access techniques, using this keyword, create elements dynamically

Positioning elements with the help of Javascript : positionning elements relatively to the mouse, move elements

Show/hide elements for creating hierarchical menus

Code optimisation techniques : using objects, objects litterals, loops optimisation

Can you please give me your availability ?"

Seriously...

CSS-fucking-1 ! Is it a course for dinosaurs ?

...And if only my rant was just about the program...

It's totally impossible to cover all these subjects in only 2 days with people of different levels and experience.

The guy exactly said to me : "don't worry about the program, it's an old text but they agreed to it anyway. They just want to learn HTML and CSS, some of them already know it but want to learn more, and the others are total beginers.".

And here is the meaning for the "(level 1+ and/or 2)" part in the email.

So... Surprizingly, I accepted the offer, but asked for at least a 3rd day. I'm waiting for their answer, but I'll do it anyway, adapting the course content to the actual students knowledge. I need the money, after all.

Wish me luck...

It's just sad that these formation companies are selling bullshit to clients that just want to learn something useful. It's too often like that, they sell shitty/useless programs and we have to catch up in real time with students that don't understand why they don't learn what was told to them.

Honestly, why on earth do people give me un-cropped SVGs. That isn't helpful...

Gamemaker studio 2's 2019 roadmap just got released.. Still no Linux IDE (FFS) but it only took them how many years to realise that not every developer is a malicious cunt and give us the ability to disable to sandbox file system?!

I swear they add and change stuff that is so trivial instead of focusing on the engines major problems and absent features, eg. Can't use SVG graphics, the need to be exported in flash (SWF) because you know, makes sense?

Please don't Google "member" when your looking for membership icons on a free SVG icon website in a very public office.

Did not understand why people posted so much on here till I had to argue with my "partner" product manager that SVG icons are better than pure CSS icons, and yes there is such thing as animated SVG, and no I'm not a designer to create fancy icons for you just because they "are actually code" you twat

Affinity Designer export to SVG, normally an easy task for a vector programme.
Furthermore it is only a little picture, a clear eight filled with a single colour.
Result: SVG with an unbelievable file size of 98.7 kB. Holy shit!
Looked at it: The export made a huge long high scaled path... oh man...
Little hand made recoding, made four circles. Done. New size: 0.8 kB.
That's better.

There is a drawing competition for my currently most played game.
I'm on vacation and the deadline is when I get back. So what did I do?

I made an inspiration cluster with the character and drawings having this arrogant face (laptop, gimp).
I sketched on my phone and put it on my laptop (the sketch). I have no desk here so I'm drawing on my bed. I have no drawing pad so I'm drawing with my mouse. Then I draw it in gimp with colors and everything (the stroke in another program on my gfs laptop), put each layer in inkscape to svg-ify them and to hq-render them back in Gimp. Corrected a few things in Gimp. Added more detail, effects (glow, gradient instead of flat color ...).

~6 hours over two days. That was fun. And fucking unprofessional.

Content strategy expert: How long would it take to program an SVG animation intro video

Me: I'm not sure I've never programmed one before.(still teaching myself)

Content expert: iS it even possible?

Me: yeah all things are possible in programming ;)

Content expert: so then how long would it take

Me: no.

Content expert: but wouldn't it be easier if...

Me: no, go away

I've been to svg once again. What do you guys think?

When you’re working on a React-Native app and decide to remove a library, don’t accidentally type a space instead of a hyphen when trying to remove something like ‘react-native-svg’. Xcode/expo get super mad when you remove react-native.

Developed my first animated svg information graphic and i am proud of it 😊

So Microsoft, no support for SVG in WPF in 2017? I really need it right now..!

Fuck Android Studio and Gradle!
Especially Gradle, you fucking slow RAM consuming shit!

It consumed like all of my RAM and my computer is lagging like shit

It can't even import my SVG!

Because of frustration I accidentally hard reset my local git repo and lost 3 hours of work!

Ok so I'm am a black end kind of guy and have had to deal with making our site again and again and again and fu#@ing again.

Who the hell thought up using SVG icons. My first look at it today and I'm not sure if I hate it or love it. Any thoughts?

React Native so far today:
1. need external dependency to load svg
2. react-native link doesn't work as it should
3. metro bundler not updating its cache

I wonder if the list will grow or that's it for today...

I loved you Xamarin.Forms I really did.
I defended you everywhere... Released 5 apps.

You FUCKING SUCK, no svg support (no none of the apis work), startup time is FUCKING insane, i could go on for hours......

Please any Android Developer out there is there any smooth transition to native? (Dont tell me about Js bullshit)

Help me fell the Native Power of Android.

Show me that apps don't need 20 seconds to start.

what does this tell you about life?

Hey guys, I was wondering how are these images created and what are they called? are they SVG graphics?

Why the fuck can’t text wrap inside a svg without JS.?

Sure you can specify svg object attributes x, y, width and height in metric values like mm and after put things on paper get same printed output but if you want to transform svg object you need to calculate new values by yourself cause you can’t simply provide translate (10mm, 10mm).

Now I ended up with manually converting values to mm.

Making free transform tool for exact document data rendering inside browser is pain in the ass.

I started to wonder how google docs or microsoft word for web deal with this stuff.

Fucking Chrome. I wish him cancer to die soon. Yeah, please fucking give me as event target svg element! Well done!

I decided to make some new icons for Atom editor (the launcher/executable ones), because I liked the vscode-icons project.

Made the repo on GitHub and decided to automate making the icons for different OS using Travis CI.

Started writing the Python Script for Travis.
My google queries:

How to generate icons for Linux?
I can use SVG or generate a PNG, many libraries available. 👍👍

How to generate icons for Windows?
Generate PNGs of various sizes and pack in an .ico file. Easy enough

So far so good.

How to generate icons for Mac?
Mac needs a .icns file, a package of PNGs of various sizes. Libraries available but can be done on OSX only. 😫😫

Then I think, what OS does Travis use?
Oh, I can specify macOS in it 😁😁😁

Starts the build 😎😎

Travis doesn't support Python on macOS

😑😑😑😑

It seems he is trying to replace HTML with svg and canvas when basic html and css can be used to make beautiful dashboards.

Like i anticipated it is gonna be a ux cluster fuck, where most of the website is an ugly bootstrap contraception and some parts gonna look like futuristic.

I'm worried that this question will probably get downvoted on SO and I cannot post from my account as well, so here it is..

How to play youtube embedded video in mobile over a custom button / svg / image ?

One idea I'm currently working on is to trigger &autoplay=1 onclick but it is only appending that parameter to existing URL?

Please let me know if you have any thoughts, and I'm doing this for only mobile devices only

P.S I cannot use YouTube API

Apparently batch converting SVG to PNG is harder than it seems.

On interview: do you know SVG?
intern: yes

It turns out that they meant that they know how to select "SVG" as the export format.

Thank god that intern went into the design department and not coding.

As we are all aware, no two programmers are identical with regard to personal preferences, pet peeves, coding style, indenting with spaces or tabs, etc.

Confession:
I have a somewhat strong fascination with SVG files/elements. Particularly icons, logos, illustrations, animations, etc. The main points of intrigue for me are the most obvious: lossless quality when scaling and usage versatility, however, it goes beyond simply appreciating the format and using it frequently. I will sit at my PC for a few hours sometimes, just "harvesting" SVG elements from websites that are rich with vector icons, et al. There is just something about SVG that gets my blood and creativity flowing. I have thousands of various SVG files from all over the web and I thoroughly enjoy using Figma to inspect and/or modify them, and to create my own designs, icons, mockups, etc.

Unrelated to SVG, but I also find myself formatting code by hand every now and then. Not like massive, obfuscated WordPress bundle/chunk files and whatnot, but just a smaller HTML page I'm working on, JSON export data, etc. I only do it until it becomes more consciously tedious, but up to that point, I find it quite therapeutic.

Question:
So, I'm just curious if there are others out there who have any similar interests, fascinations or urges, behaviours, etc.

*** NOTE: I am not a professional programmer/developer, as I do not do it for a living, but because it is my primary hobby and I am very passionate about it. So, for those who may be speculating on just what kind of a shitty abomination of a coworker I must be, fret not. Haha.

Also, if anyone happens to have knowledge of more "bare-bones" methods of scraping SVG elements from web pages, apps, etc. and feels inclined to share said knowledge, I would love to hear your thoughts about it. Thank you! :)

Guess it's a sign you haven't had enough sleep when you're creating a slanted div and it looks curved so you compare with a ruler to be sure and it is in fact straight.

Guys help!
What's the best way to convert an svg vector to swf?

I'm stuck on windows though :-/

Can someone suggest me a quick way to create some svg files or convert some basic flat shapes like image of a redcircle or a blue heart into .SVGs?

I don't have any experience in graphics development, so online/offline tools or converstion engines would be also nice.

I'm sorry, but who thought eslint or any linters for that matter were a good idea.

Started a new vue project using the cli, installed tailwind... oh what's that you don't like the line length... get out of here. It's an SVG and using a class-based framework. The hell.

Any way of removing eslint? I just want to code and not get bs warnings because of an svg length or because I add one to many classes.

Google svg is much better name because of the jack removal

Working with friend and using nodejs websockets and SVG to build online multiplayer lazer screen arcade like games.

The only delay is having to stop every couple of minutes to restate how cool this is.

We can't have good things, can we, SVG implementations??? Apparently, I can't re<use> anything from adjacent file, because only Inkscape understands it. Or to seek support in browser, server is required to see a group from one SVG file in another. Why?

CSS (and all of frontend) is hard. The last few braincells left in me are slowly dying.
I just wanted a progress bar. HTML 5 supports <progress> out of the box. But all browsers want to act differently. Add more boilerplate for each browser type. Somehow got a transparent background on progress bar but it still won't let me change progress color.(Surprisingly, only IE let me change the color) At last, settled with a transparent div with a colored span inside, + js to handle value. Was this really the best way? Nope. But this was the only thing that worked,(other than importing a JS library, which would render a SVG to replicate a progressbar)

Why is front end so convoluted? Half of the things do not even make sense to me. Is this really the direction we want to go in the future?

apple you mongoloids, default background of images should be transparent not white

im too retarded to figure out how to be able to view these fuckign white images (svg file extensions to be specific) ive been given because the fucking default background is white and im too retarded to find a way around it quickly (still working)

fuck you

"IT juSt WerkZ!!!!1111" - steve jobs dying of an easily prevented early caught cancer or some shit because he doesn't want the minimally invasive surgery that would fix him, but would rather juice cleanse (idk if true, only vaguely remember memes)

What do you guys think about using Pyqt for building an open source Svg Editor?

I don't understand why the fuck it takes me more than a day to fucking make an svg work dynamically with its background and it still doesn't work for fuck sake

I'm wasting fucking hours to crop a fucking svg file!
I swear, I tried in all the ways, firstly I didn't want to download a software so I searched for some online editor, I tried fucking 10 of them, but none of these had a way to crop images. How the hell should I be able to craft images if I'm not able to decide the size, eh?
I read online that inkscape gives a lot of problems when it's about to crop images, and of course I didn't want to pay illustrator to fucking crop a file, so in the end I decided to give a chance to inkscape. The website gives me 502 bad gatweay.
Ok.
FUCKING CROP AN IMAGE.
2018.
TWO THOUSAND AND EIGHTEEN

if your online preview is an svg without watermark, why should i sign up for a paid account to get vector files?

Has anyone worked on developing an electronic schematic creator/editor application?

Just putting the idea out there:

How cool would it be to be able to make SVG screensots!
The OS asks every application within view whether it supports SVG rendering. If so, it collects the SVG rendering. If not, it uses a PNG pixelated fallback.
Most form applications and browsers should be able to provide SVG renderings of the view, right?
Imagine the crispness of the screenshots...

Holy shit how have I not tried using an SVG inside of a sudo element before. That's awesome and will save so much time styling global elements.

I'm trying to load an SVG icon sprite file in a Webpack based application. It's been almost three hours with no success.
This is why I hate frontend development. Libraries are not structured and make no sense. It's a game of luck.

Are there any good uml connector libraries to connect svg components using svg paths. The connections should sustain even if the svg components are moved/dragged around.

Modern Web Developer
(To the tune of "I Am the Very Model of a Modern Major-General" from Gilbert and Sullivan's "The Pirates of Penzance")

I am the very model of a modern web developer
I’m quite fluent with JavaScript; An HTML whisperer
My code is clean and elegant, I genuinely innovate
And even know my way around a Promise and async / await

I’m very well acquainted too with matters vector graphical
I understand why SVG coordinates seem magical
And even without Photoshop I elegantly can produce
A mockup or a logo in most any format that you choose

[Chorus]
A mockup or a logo in most any format that you choose
A mockup or a logo in most any format that you choose
A mockup or a logo in most any format that you choose

I'm quite adept at ES6 expressions like destructuring
I know the ins and outs of functional reactive programming
In short, in matters browser-based or Node.js if you prefer
I am the very model of a modern web developer

[Chorus]
He is the very model of a modern web developer

I know our mythic history, the humble start, the browser wars
I know why Douglas Crockford fought the battle over ES4
The World Wide Web Consortium and Ecma International
My knowledge of our legacy is truly supernatural

With LESS and SASS and CSS, designing for mobility
I’ll perfectly apply the right amount of specificity
From custom fonts and parallax to grid and flex and border-box
I know most every tip and trick both common and unorthodox

[Chorus]
He knows most every tip and trick both common and unorthodox
He knows most every tip and trick both common and unorthodox
He knows most every tip and trick both common and unorthodox

And when it comes to lazy loading, bundling up and splitting code
There’s nothing quite like Webpack, which of course is built on top of Node
Considering my resume, I’m certain that you will concur
I am the very model of a modern web developer

[Chorus]
He is the very model of a modern web developer

When new frameworks and libraries emerge I must be ravenous
And gobble up the hot new thing, my appetite is bottomless
React and Vue and Angular, Immutable, RxJS
The list will be outdated long before I'm finished singing this

My pull requests rely on multitudinous utilities
To help me lint and test and build, a deluge of analyses
And every single day there are a hundred thousand more to learn
The web is going through an irresponsible amount of churn

[Chorus]
The web is going through an irresponsible amount of churn
The web is going through an irresponsible amount of churn
The web is going through an irresponsible amount of churn

This pace is agonizing! Code from yesterday is obsolete!
The speed of innovation is enough to knock me off my feet!
It's happening too fast! I can’t keep up! I’m tired! It’s all a blur!
I am the very model of a modern web developer!

[Chorus]
He is the very model of a modern web developer!

the error was svg not javascript. urghhh

Heya

Does anyone know how the profile customisation is made ?
i think i can manage to do it using canvas
But also svg doesn't sound that bad

So ?

SVG API getPointAtLength() is my favourite because I hate math! 😊

Article about creating gradients programmatically.
FullHD png with gradient at the top...

Use fucking svg or at least webp! It's 2k17 already.

A lot of graph theory libraries create a HTML/svg elements for nodes. Is it possible to convert the existing svg elements to graph nodes?

How to prevent svg tag from fucking my html structure up ?

Is there a plug-in in vscode to hide that?

Chrome handles CSS animation on an SVG element with 500 nodes like a champ with an SVG graphic with outline animation over it.

Firefox barely animates the SVG then has tearing issues when a part of the SVG leaves the viewport and re-enters. Annoying AF and now a changed design.

Welcome to school. In my case the place where you are getting teached design and the teachers don't know what the hell svg is. And teach you that gif animations are the best way to implement buttons on your website. 😂

working with Mapbox and so far everything works except displaying custom svg pointers for single points while clustering the multiples.
the documentation is only semi useful.
and my work-at-home coworker keeps meowing at me like that guy who wants to talk about TV shows whenever I'm working
I want a nap!

Wondering still good use SVG in CSS or better other format?

I simply hate d3.js. This thing is a night mare. stupid svg and canvas and d3.js
Fuck this charting library. Burn in hell!

Does anyone know of a good tool or service for compressing svgs for web.

I got about 80 files I need to reduce in size

Help!

Fucking android...
Spent my whole day trying to tint (i.e. alter the image color) some svg with a PictureDrawable in an ImageView.
Went android underground, thought it had something to do with LAYER_TYPE_SOFTWARE (since this was required to render the underlying svg), tried my way through ColorFilters and ColorStateLists...
8 hours later I discovered that apparently YOU CANNOT TINT a PICTUREDRAWABLE - this only works with BitmapDrawable. *argh*
And not a word of mention in the fucking documentation *tit*

I had to make a ruler grid for an existing horizontal scroll website project, but I had the job basically for sure.
I came up with a solution which included PHP-generated SVG embedded in HTML.
It was a new thing to me at that time, but a cool challenge.

is there an SVG file available of the devRant logo by any chance?