Retinafy everything
Why should you think about vector graphics now?
Retina-displays (thanks to Apple for a convenient marketing term) have already become part of our lives. If you are a web developer / designer, and you do not take into account how your work is displayed on high-resolution screens, then you seriously fall out of current trends.
')
Is it difficult to make your Retina-ready product? If we are talking about the interface, the answer is “no”, there are several techniques (the most complete list of them can be found in the book “ Retinafy ” by Thomas Fuchs). And when you understand all the problems and limitations of current technologies, it becomes clear that making modern and “clear” websites is quite simple.
The main problem today is the images that you generate on your server: graphics, reports and any other visual data. They are beautiful and clear, but not when you want to send them by email or give them to your users for download. For example: Google Analytics Report from Visual.ly , looks great in the browser and very “zamylennym” when loading.
What is the problem? Why not just increase the resolution of the image and everyone will be happy? Perhaps at the moment it will be so, but this is a dead end, you can’t increase the resolution to infinity: the final size of the image file will grow proportionally and your customers are unlikely to be satisfied.
So we come to the theme of vector images: they are a structured representation of graphics, with no restrictions on image size: scalable depending on your requirements, without degrading the quality and increasing file sizes. There is another problem: there are many solutions for creating vector images, in particular SVG, in the browser (Raphaël.js, D3, Highcharts, etc.), but there are no powerful solutions for creating them on the server, only a few hacks that help to use them on the backend. Many of them are based on headless versions of WebKit: Highcharts and Freckle .
Our team spent a lot of time researching and comparing all existing approaches and came up with their own solution to this problem. After a year of customization and optimization, we realized that we can make this tool available to other developers who are faced with similar problems. This is how the Svable project was born.
Svable is a service for generating SVG in the cloud. All that is required from the developers is to simply send us JSON data with a list of rules and get your SVG file / link to it (or the result of converting your SVG to PNG or PDF).
But what about duplicate code? As developers, we hate it when a new service forces us to repeat all the logic of our application that uses Raphaël.js, for example, to create some “JSON - rules“. In this case, it is easier to follow the approach of launching a “browser on the server”. We understand this, so now adapters for popular solutions and languages ​​are our main goal, so you can just copy and paste the service access key, and then the adapter would convert the Raphael code to JSON for Svable. No duplication: you can use the same code on the client and / or on the server.
We are at an early stage and are looking for real users to integrate our solution before opening it to everyone. If you have complex SVGs (or a desire to create them so that your retina clients are happy), you have a good chance to start creating them quickly and simply, just write us about your situation.
Let's make beautiful internet together.
Retina-displays (thanks to Apple for a convenient marketing term) have already become part of our lives. If you are a web developer / designer, and you do not take into account how your work is displayed on high-resolution screens, then you seriously fall out of current trends.
')
Is it difficult to make your Retina-ready product? If we are talking about the interface, the answer is “no”, there are several techniques (the most complete list of them can be found in the book “ Retinafy ” by Thomas Fuchs). And when you understand all the problems and limitations of current technologies, it becomes clear that making modern and “clear” websites is quite simple.
The main problem today is the images that you generate on your server: graphics, reports and any other visual data. They are beautiful and clear, but not when you want to send them by email or give them to your users for download. For example: Google Analytics Report from Visual.ly , looks great in the browser and very “zamylennym” when loading.
What is the problem? Why not just increase the resolution of the image and everyone will be happy? Perhaps at the moment it will be so, but this is a dead end, you can’t increase the resolution to infinity: the final size of the image file will grow proportionally and your customers are unlikely to be satisfied.
So we come to the theme of vector images: they are a structured representation of graphics, with no restrictions on image size: scalable depending on your requirements, without degrading the quality and increasing file sizes. There is another problem: there are many solutions for creating vector images, in particular SVG, in the browser (Raphaël.js, D3, Highcharts, etc.), but there are no powerful solutions for creating them on the server, only a few hacks that help to use them on the backend. Many of them are based on headless versions of WebKit: Highcharts and Freckle .
Our team spent a lot of time researching and comparing all existing approaches and came up with their own solution to this problem. After a year of customization and optimization, we realized that we can make this tool available to other developers who are faced with similar problems. This is how the Svable project was born.
Svable is a service for generating SVG in the cloud. All that is required from the developers is to simply send us JSON data with a list of rules and get your SVG file / link to it (or the result of converting your SVG to PNG or PDF).
But what about duplicate code? As developers, we hate it when a new service forces us to repeat all the logic of our application that uses Raphaël.js, for example, to create some “JSON - rules“. In this case, it is easier to follow the approach of launching a “browser on the server”. We understand this, so now adapters for popular solutions and languages ​​are our main goal, so you can just copy and paste the service access key, and then the adapter would convert the Raphael code to JSON for Svable. No duplication: you can use the same code on the client and / or on the server.
We are at an early stage and are looking for real users to integrate our solution before opening it to everyone. If you have complex SVGs (or a desire to create them so that your retina clients are happy), you have a good chance to start creating them quickly and simply, just write us about your situation.
Let's make beautiful internet together.
Source: https://habr.com/ru/post/198126/
All Articles