ManyPixels Blog

Learn everything there is to know about graphic design
ManyPixelsAug 06, 2019

Our favourite design requests (July 2019)

Here we go again, here are our favourite design requests of the month of July. All those design requests have made by our ManyPixels designers. Congratulations Juan, Adit, Ita, Evgenia, Christian, Wis, Nurul fore being be featured in this month's collection. 1. Blog post images One very good way to make your content stand out is to illustrate your articles with images throughout: It is easier to read! Blog post images are a very popular type of requests that companies or bloggers order on ManyPixels. Blog post images 2. Comparison graphics (with illustrations) Another popular design request on ManyPixels are comparison graphic design requests (with our without illustrations). Comparing how your product stands out from the competition or comparing different customers (before / after, or with / without) is a great way to explain your value proposition to your prospective customers. Comparison graphic 3. Brochure with illustrations This one is my personal favourite! Whether you are sending a print or digital brochures, complementing it with illustrations is a great way to appear more professional and convey the benefits you are offering to your customers. Brochure with illustrations 4. Infographic design Here's a creative way to amplify your content: Graphic design to repurpose your content. As a company or blogger you probably have a ton of content but having infographics is a great way to re-use and reformat the content you already produced. Infographic design 5. Landing page with quirky or cartoonish illustrations Here's a trend in design: cartoonish illustrations on landing pages / marketing websites. They make your website have a unique feel and distinctive branding. Landing page with cartoonish illustrations 6. Carousel Facebook ad designs (with illustrations) Here's two ideas for your next Facebook advertising campaign: Tell a story or show the multiple benefits your product / services has. A great way to do so is to use illustrations (they are great for storytelling) and the Carousel ad format from Facebook. Carousel ad designs 7. Isometric illustrations Here's a unique type of design request our designers love to do: Isometric illustrations. These illustrations are great for video game companies or simply if you want to design a city, design an office building, or design a map. Here's an example design by our team: Isometric illustration 7. Children book illustrations or character design A huge audience is for products (books, gaming, education) is children and the best way to communicate what you do: With illustrations! Here's an example made by our team with fun character illustration designs: Children book illustration 8. Lead magnet design What is the next step after you attract traffic to your website? Convert your users! The best way to convert your users it to offer a free product / service / sample and that is called a lead magnet. We do that at ManyPixels with our design library. You can use this lead magnet on your blog / on our main website. Here's an example of lead magnet (without copywriting): Lead magnet design 9. Packaging design Are you running an e-commerce store or any store that deliver physical products? Having a great packaging is great for marketing / improves the value perception of your product. Here's an example done by our team in July for a moving service company (and their custom moving boxes!): Packaging design Packing design 10. Custom multipurpose illustrations I think you noticed: We love illustrations! Here is some more inspiration. You can use illustrations to complement your how it works page, the different services / products you offer, or simply to make your website more easy to understand. Custom illustration Custom illustration Custom illustration If you need custom design made, you can always check out our website.... Read more
ManyPixelsJun 24, 2019

June 2019 Design Ideas

Each month, we're doing a small round up with design trends and ideas for your next requests. Here are 7 ideas for what you can request in June. 1. Blog post illustrations The currency of internet is content. Great content will help you get ranked on search engine, but also educate customers. One way to make your content more interesting and engaging is by creating blog post headers / illustrations. Here's a simple blog post header by Alex: Blog post header Another request idea is to request multiple blog post headers at once. This is useful if you want to plan this along your content calendar: Here's an example done by Alex: Blog post header 2. Custom illustrations Another popular request is custom illustrations. You can use them for practically anything you want! Custom illustrations Custom illustrations 2 3. Landing page illustrations Another request you can make is landing page illustrations. They will capture the visitor attention and reduce bounce rate. And as an added bonus: This makes your branding more unique! Landing page illustrations Here is another example done by our team: Landing page illustrations 4. Pinterest image design Another great source of leads for your business is Pinterest. Here is an example of design made by our team: Pinterest image design 5. Logo and brand guide One of our most popular type of request is logo and brand guides. Here is one our team made for a fin tech startup. Finin 6. Banner design Banners are a great way to catch the attention. Whether they are to display on your website (to ask customers to download an ebook for example) or for advertising, having a well-designed banner will improve conversions. Banner design 7. Display ads Another popular request you can order is display ads. Whether it is for Google or Facebook, you can make one request and ask them to have them designed for multiple platforms. Here are some examples designed by our team: DisplayAds DisplayAds2 DisplayAds3 ... Read more
ManyPixelsJun 13, 2019

Pixelian of the Month: Juan

With a slight delay, here is the Pixelian of the month of April! The award was given to Juan! … 🥁 … Juan Juan Juan joined ManyPixels a year ago and is a full-time freelancer on our platform. (Each month, we recognise the great work of ManyPixels’ designers by giving an award, the Pixelian of the Month is awarded to acknowledge excellent design and communication skills and the designer receives an additional bonus) 1. Can you tell us about you? My name is Juan. Nothing really special about me. I'm a designer and currently work and live in Jakarta, Indonesia. I am passionate in brand development and editorial design (presentation design such as pitch decks as well). Aside from design I also like football and watching movies. I loved good visuals since I was a little. I was good at drawing and I love to draw new designs for products such as cars or sneakers (I was a sneaker enthusiast way before I knew what a sneaker enthusiast was), packaging, etc. Those factors encouraged me to take a design major. There was a product design major in one of the university in my hometown but I didn't feel it was good enough so I decided to take visual communication design instead. From there I learnt a lot and found some fields I loved to work on, and here I am. Juan sketching laptiop Above, work in progress of a logo by Juan 2. What’s your typical day like? I often work at home but once or twice a week I also work in some nice coffee shops. My favourite coffee shops in Jakarta are Chief Coffee (try their Bailey's Latte), Kopi Nalar, OnThree, and 1/15 Coffee in Menteng. Working at different places helps me to keep refreshed, but can also distract me if I do it too often. On Three Coffee OnThree, one of Juan's favourite places to work from in Jakarta When I am done with work I sometimes do indoor football or hangout with friends during weekends. 3. How do you get inspired? My inspiration really comes from anywhere. It can come from books, internet, visiting places and learn new things, even from talking with people. Specifically, I use Behance and Pinterest the most. That said, I use Instagram for my daily dose of inspiration. There are lots of great agencies and designers sharing their inspiring work, and also some accounts share curated designs which makes it easier for me when I need some specific style for inspirations. My favourite Instagram accounts to follow are visualjournal.it and WeLoveBranding 4. Can you share some of the pieces of your work you’re most proud of? I really liked doing the logo for Finin, a fin-tech app. They were really happy with the result and also asked for business cards, letterheads as well as the full branding package. Finin Finin Finin 5. Finally : What’s your advice for designers? Nowadays visual design tends to evolve faster, and to stay relevant you have to stay up to date and be aware of trends. But don't give up your design style just to follow the trends. You can always adapt the trends to complement with your personal style, in your own way to make it unique and you. Thanks for the interview, Juan!... Read more
ManyPixelsJun 10, 2019

Our favourite design requests: May 2019

So what did our designers work on in May 2019? They worked on more than 500+ design requests for our clients and here are some of the coolest work they've done, curated for you! 1. T-Shirt design "Ben Franklin" (by Christian) Christian is a talented illustrator that joined us as a freelancer a few weeks ago. The request was simple: Design a T-shirt with Ben Franklin drinking a pint of beer. The objective was to sell this t-shirt on Amazon Merch. Amazon Merch T-shirt design Great result, isn't it? 2. Pitch deck / Investor presentation design (by Juan) One of the most popular requests we have is powerpoint presentation redesigns. Whether it is sales decks, pitch decks, or simply an internal presentation, designing it with the correct branding is really key in order to pass the right message. Here are a few slides of the deck: Slide deck design Slide deck design Slide deck design Slide deck design 3. Explainer infographic (by Nurul) Infographics are a powerful way to communicate a message. Once your infographic is done you can also ask to have special versions for posting it on LinkedIn, Slideshare, Instagram, or Facebook to make sure the right message is sent in the right format to your audience. This request was not an easy one for Nurul: Lots of data and specific branding guidelines to respect but the result is beyond awesome! Explainer infographic 4. School poster design (by Evgenia) This request is one of my personal favourites: I really love the level of creativity (and it wasn't an easy one as Evgenia used multiple fonts). School poster 5. Custom illustrations on our gallery (by Wis) Earlier this year we released our royalty-free, 100% editable SVG illustration gallery. Each week we update our illustration gallery with 15-20 new illustrations. Free illustrations 6. Coverage map for a car-sharing startup (by Japhet) This request wasn't easy either - redraw an entire map with the branding of the startup and add precise locations of the coverage. The result turned out excellent! Coverage map car sharing 7. Flyer with illustrations (by Alexander) This request was for a crowdfunding e-book promotion: Design a beautiful flyer with custom illustrations. Flyer with illustrations 8. Infographic for a SaaS (by Japhet) This request is for a SaaS infographic. The request had a lot of data point so it wasn't an easy feat for Japhet. Infographic for SaaS 9. Email marketing banner (by Deddy) Email marketing banner design Another request we have are email marketing design materials: Newsletters mostly! This project was very fun to do for Deddy: Design a custom illustrations and follow the branding guidelines of the customer. 10. Dashboard UI design (by Kevin) a Dashboard design for an upcoming car sharing startup. Dashboard designs are usually very demanding and demand a strong eye for a great user experience and Kevin did a great job at this! Dashboard design 11. WINNER: Sales brochure illustration (by Evgenia) And the winner is... This sales brochure illustration by Evgenia. I thought the result was so beautiful aesthetically yet conveyed a lot of important information. Great job! Brochure illustration ... Read more
ManyPixelsApr 03, 2019

Pixelian of the Month: March 2019

This month, the award of Pixelian of the Month goes to... ... 🥁 ... Kevin! Kevin Kevin joined ManyPixels a few months ago and is a full-time freelancer on our platform. (Each month, we recognise the great work of ManyPixels' designers by giving an award, the Pixelian of the Month is awarded to acknowledge excellent design and communication skills and the designer receives an additional bonus) 1. Can you tell us about you? Let me introduce myself, my name is Kevin. I was born in Indonesia's capital, Jakarta. I reflect myself as a well - quite non-interesting individual. Perhaps that's caused by my extreme Introversion personality (I took that online MBTI test kind-of-thing, and got the award for getting a 92% introversion result). > ## My only passion was to play video games and to draw anything related to it. You could say I would highly prefer to do everything and keep everything by and to myself. But may be I can share a few things this time (especially doing it digitally) : My path to work as a designer begins from childhood times. Back in the day, my only passion was only to play video games and to draw anything related to it. That habit is kind of bad as it can took focus out of my study, sitting in the back of the class doing nothing but sketching useless stuff. (Today, I stilll like drawing stuff, just more rarely). It really took its toll as I failed my first year of high school. That event was quite a wake up call for me to focus on something more important. In the end, I am really glad I finished my high school with nearly perfect grades. spaceguns Above, a sketch done by Kevin. College times, I finally could focus on doing artsy stuff again. So I entered Bunda Mulia University in 2013, and started having a great time studying visual design. It made my inner artist finally shine at the right place. With years passing by, I really got into learning Motion Graphics and User Interface Design there. Just sadly the UI lessons provided were quite shallow for me so I decided to lean deeper towards Motion Graphics first. The result of that is I worked initially as a 2D Animator Intern for 3 months, which I really liked. While doing that I was still intrigued by how UI worked and decided that my next full time job should be as a UI designer. You could say it was quite a struggle to find a job, as I didn't have any solid UI portfolio, let alone any UI experience. But thanks god, I finally got accepted by a micro-startup in North Jakarta as a junior UI/UX designe thanks to my motion graphics skills. During my time as an intern, I learnt many things by working closely with developers, and getting a good grip on how UI/UX in an app works. Sadly, just 7 months into the job, I got badly ill and had to take a long break, giving up my job. I finally got better and here I am, working as a Junior UI Designer at Manypixels. I have been here for 7 months and hope I will never catch that illness again. 2. What's your typical day like? > ## I also very much like it when my work is uninterrupted most of the time. My typical working day is pretty usual. I wake up, have breakfast and shower before 8.45 am. Then I immediately open my laptop, and begin to work. I also very much like it when my work is uninterrupted most of the time. (Perhaps my only breaks are just lunch and going to the bathrooms). The main reason I work like this is that I very much like to keep my working pace efficient and avoid overtiming. I tend to finished my work exactly at 16.45 everytime . After my work is done, I finally have a leisure in the same sitting spot and play Destiny 2. My favorite game for the moment. I play it till the night's over and get to sleep. Next day, I wake up and repeat. Yeah, I know it sounds really boring to some, but hey, I absolutely love that. Being humble, doing nice & honest work, some work / life balance, this is good enough for me. 3. How do you get inspired? My main inspirations for my artworks came from the web, Dribbble, Instagram, Behance, the usual stuff. That said, I have a tendency on looking for them rather rarely. 4. Can you share some of the pieces of your work you're most proud of? Yes, I do and it's not the prettiest project. But it's a very good example of pursuing great collaboration with the client, which I think we observe more often. Sometimes when we do design projects, it feels like a one way street. Either the client is agreeing to us on everything every single time, or the client keep having endless revisions to a spiralling infinite oblivion. In this project though, the client is actively asking questions, giving suggestions, and we do it vice versa. It's like talking to a colleague rather than a bossy figure, a really fluid two way collaboration that makes working on this project really fun. kevinwork 5. Finally : What's your advice for designers? I got no particular useful advice, but I may say that just do what you really feel best for you and be grateful, as not everyone may be as lucky as compared to where you stand right now. So yeah, just be grateful. Thanks for the interview, Kevin!... Read more
ManyPixelsApr 02, 2019

10 Popular Requests on ManyPixels

Wondering what to order on ManyPixels? Here are 10 popular requests you can order today. 1. Sales decks Let's face it, in business you constantly need to sell (at one point or another, your job mostly is about selling, in the words of Sam Altman) So how do you sell? You need to pursade You do so with a great presentation or in other terms, a sales deck salesdeck salesdeck2 salesdeck3 At ManyPixels we use sales deck a lot. When we reach out to a prospective company, we follow up with a customised sales deck. It speaks to them, it shows we understand their problem, and we try to book a call with them. Here is what goes into a great sales deck: What problem you're working on for them (your customers) What solution you and why your solution is perfect for them (why they should care) Reference of past clients (clients won't take your words, let your work speaks for it) Pricing Contact details Tip: Also add "Services/Product for..." to make it personal! Here is an example of another sales deck: salesdeck2 2. Logo design with mascot Logo designs with mascot make your brand really unique. In addition to making your brand unique, it also gives you to opportunity to have a logo with multiple use cases (with or without mascot) Here are some logos that our designers have created: harvylogo grumpylogo happierpets 3. Infographic design Infographics are a great way to repurpose content. As attention-span is now hugely limited, you have to find another way to capture attention. Here are some examples on how you can use infographics to market your business: Use them as Facebook Ads to drive traffic to one of your ebook or blog posts. Use them in your presentations Use them as social media posts on LinkedIn, Instagram, Facebook Use them to illustrate your blog posts Here are some examples of infographics our team has designed: infographic1 infographic2 infographic3 4. Display ads Advertising, whether through prospection or retargeting can be an incredibly effective way to generate traffic and leads, build your brand, or even directly drive direct sales to your website. Here are some examples of ads you can request that your team has produced: displayaddesign displayaddesign displayaddesign 5. Reports, manuals, and company culture books Another idea to request is to create reports or manual: Present information beautifully so people actually want to consume it. Tip: You can actually put these reports in powerpoint format and put them on Google Slides to share them internally with your coworkers or with your investors. reports 6. Landing pages Landing pages design is a very popular design request on ManyPixels. Designing a landing page is usually better to go into redesigning a full website for several reasons: A landing page gets the visitor to do a single action: Usually booking a call or leaving their email address, downloading an Ebook, etc. They are a great marketing way to capture the attention to a visitor towards a single objective. Here are some examples of landing pages you can request: General landing page s Book a demo landing pages Referral page landing pages Contest landing pages Coming soon landing pages Here are some examples of landing pages that our team created: landingpage landingpage landingpage 7. Email and newsletter designs Building your email list is like having your own little piece of Internet real estate, where your subscribers are your tenants. Unlike Facebook, Twitter, LinkedIn and other social media platforms, email is still a strong and independent way to reach out customers. Building your email list is thus hugely important! Once you've built your list, having compelling emails. Here are some examples of email designs you can request on our platform: Welcome emails Lifecycle emails Receipts emails Newsletters Here's an example of an email design from you team: emaildesign 8. Custom made illustrations and icons Illustrations are one of our most popular services as well. They have multiple uses cases: Make a powerpoint presentation look nicer or unique Help create social media graphics Help create landing pages Here are some example of illustrations illustrations illustrations Or for branding purposes. This e-bike app decided to create a lot of illustrations to help with their branding: brandingillustration brandingillustration2 brandingillustration3 9. Facebook page branding Another popular example of request is redesigning your Facebook page / Messenger bot. facebookbranding 10. Pitch deck redesign So you're planning to raise your seed or series A round? Well, a better pitch deck will definitely impress your potential investors. Here are some screens of a pitch deck we've recently redesigned. pitchdeck pitchdeck pitchdeck pitchdeck pitchdeck pitchdeck pitchdeck pitchdeck pitchdeck pitchdeck That's it! We will regularly be posting more popular example of design requests.... Read more
ManyPixelsApr 01, 2019

Our month in Review: March 2019

March was a busy month for ManyPixels! Here are four important things we achieved in March: Hired new team members Launched a huge marketing project Completed 95% of our new platform (and launching it in the next few weeks to a few select customers) Started seeing repeatable growth (but we're not quite there yet) 1. Expanding to 🇷🇴 Romania Growth cannot happen with an intrinsically great product. But also great operations / service delivery as we are a managed design services marketplace. In order to have great operations, we needed to have a great team in place which has been our top focus for the month. So we asked ourselves: What are the attributes of a great team? Great communication skills Alignment with our values and goals (we can enable them to grow as we grow) Most of my focus with Quentin was thus hiring freelancers based on those values. After building the largest part of our team in South East Asia for a year (and I lived in Indonesia for one year to recruit myself the first designers on the platform), we made the decision to start hiring designers in Eastern Europe, starting with Romania. Why did we make this decision? European designers can work in the same timezone of our customers, and thus can ensure faster response rate which will improve customer experience. Liana is our team leader and Alex and Alin joined us as a designers. We're going to announce many more new designers very soon. Here is some of the work from our talented designers from Romania. grumpybearlogo Or this work... happierpets 2. Launching our 🎨 free illustrations gallery freeillustrationgallery Our free illustration gallery is our main marketing tool at ManyPixels. We created this for several reasons: We are big fans of beautiful, modern illustrations. We want to help entrepreneurs that are at the beginning of starting their own projects. We use it to drive traffic to our main website through retargeting, newsletter subscriptions, etc. How did we launch this? We first decided to promote it on various Facebook groups that could potentially be interested in it (FB ads, E-commerce, Startups groups...) fbpost The engagement on Facebook groups was so high (due to people commenting) that I suspect my post organically reached tens of thousands of people, without any paid advertising. We then launched it on Hacker News. It hit the front page within a few hours and stayed on the 8-9 spots for almost 24 hours. Shortly after, we got hunted on ProductHunt! producthunt In total during launch week we got about 15k visitors. Due to the overwhelming response, we decided to double down our efforts on the gallery. Instead of 5 new illustrations per week, we set a goal of creating 10 new illustrations per week. If this still works well? Well, we'll double that number again. How did it perform for us in terms of traffic and sales? The illustration gallery has been quite a success so far. Here is the spike of traffic from Google Analytics after the launch of the gallery. illugallerystats In terms of subscribers, we receive 70 to a 100 new email subscribers per day and 3000 visitors on the gallery (this number has been constant since a few days). We also ran an email campaign that resulted in 6 sales, all from the gallery subscribers. I think this kind of product will probably grow best based on word of mouth and just producing exceptional illustrations is thus our main goal. Let's see how it goes in a few months! 3. Product improvement Geoffrey recently joined ManyPixels as CTO. Quentin and I went to Paris to meet him back in December 2018 and we spent 5 days just working at various coffee shops / coworking spaces in Paris + spending all evenings together. I highly recommend that you spend a lot of time with your cofounders so you know their working styles. After being sure we wanted to work together (this goes on both sides), we created a shareholder agreement and Geoffrey joined us as CTO as of January 2019. The first task was to recreate a professional looking website, but then what really mattered to create value was creating a solid platform to do the following things: Enable customers to place design orders seamlessly Dispatch orders and manage workers Communicate and collaborate In the upcoming weeks, we are releasing the platform to a select group of our subscribers. Here is a sneak peek of the platform (still in progress!): sneakpeek 4. Growth My main responsibility at ManyPixels is growth . Finding customers, retaining them, and then making sure they have such a great experience that they become loyal fans that refer the product to their friends is a loop that we need to attain. Here are some of our results from our growth efforts: Website traffic for the month is 31k visitors. This month it is projected to be around 90k. We went from 90 email subscribers in early March to well over 2000 now. Revenue went up by +13.6% Net revenue went up by +14.6% We launched only 1 email campaign, it resulted in 6 sales. We started experimenting on retargeting ads with a very low budget. Our marketing is basically a mix of three things: 1. Sales Our sales process goes like this: Targeting: We asked ourselves by looking at our customers what were the attributes of our customers and know more about who they were. We then built list of potential customers. Cold-emailing: It can be an incredibly powerful way to get customers. We do not have a perfect system (yet) for this but we are getting there. We book on average 3-4 high quality calls per week that land long-term customers. Demo of our product / Sales deck: Once the customer has received an intro call, we follow up with a Sales Deck (or soon: A demo of our product for their industry) 2. Content Content is like our long-term, safe investment that we would be crazy not to have in our marketing portfolio (in the words of Julian). I see we can add value by creating two types of content: 1. Brand content - Monthly reviews, designer of the month, How we do X or Y at ManyPixels. This type of content can add value to entrepreneurs seeking to know how to grow their business. 2. SEO content - Content that people actively search about, example: "How to make an infographic" 3. Ads We recently started using ads, for now only by focusing on Facebook Ads and we've already had 10 conversions and a positive ROI. We are doubling our efforts on ads as well. Conclusion It's already been 3 months since the start of the year and our focus for the next three will be: Continue to attract talented freelancers on our platform and make that process faster and smoother. Achieve scalable and repeatable growth. Improve our product / service delivery so we can continue to generate word of mouth.... Read more
GeoffreyMar 29, 2019

How to build a gallery with editable SVG illustrations

I’ve recently made a gallery for ManyPixels displaying SVG illustrations available to help people with their projects, kinda similar to Undraw in its behaviour. Using it is pretty simple: You browse the gallery, pick color that match your brand, click it, download it as PNG or SVG (with updated colors!) and voilà! So how I did it ? It’s a work of developer and illustrator. Designing the right way To make all of our illustrations, we use Adobe Illustrator. It’s all about one colour First you need to choose one color which will be your “dynamic color”, for our gallery we used the hexcolor #68E1FD to match our brand. Every illustrations must use this color or the javascript code won’t work when color picking. You can of course use other colors as “static colors”. To achieve the gradient effect, never use gradients. You have to create mask layers, gradiant white or black and play with the opacity. Exporting your SVG When exporting, you have to select Presentation Attributes, we have our SVG code with attributes like fill=“#68e1fd” which will be easily changed with code. The coding part Color Picker import React from 'react'; import { ChromePicker } from 'react-color'; import { dynamicColor } from '../constants/colors'; class Magic extends React.PureComponent { state = { color: dynamicColor }; onChangeColor = color => this.setState({ color: color.hex }); render() { const { color } = this.state; return ( ); } } export default Magic; The goal is to get the hex of the dynamic color you will change later in your illustrations. For my example, I used react-color which provides few styles of color picker easy to use. How to change the SVG color import Svg from 'react-inlinesvg'; import styled from 'styled-components'; import { dynamicColor } from '../constants/colors'; const ContainerSvg = styled.div` *[fill='${dynamicColor}'] { fill: ${p => p.color}; } *[stroke='${dynamicColor}'] { fill: ${p => p.color}; } `; Can't load image I’m using styled-components to do all the styling in the gallery. By giving my dynamic color as props, I replace everywhere in the SVG with fill=“#68E1FD” by new hex color. The illustration is updated instantly. import React from 'react'; import { ChromePicker } from 'react-color'; import { dynamicColor } from '../constants/colors'; import { ContainerSvg } from './toto.style'; import Svg from 'react-inlinesvg'; const url = "https://media.graphcms.com//ztnygNBMTHuPDarh6hxH"; class Magic extends React.PureComponent { state = { color: dynamicColor }; onChangeColor = color => this.setState({ color: color.hex }); render() { const { color } = this.state; return ( Can't load image ); } } export default Magic; Save as PNG or SVG with updated colors You have to first get the ref from your inline SVG. this.svg = ref} > Can't load image Saving as SVG is really simple, you get the svg string from the inline svg reference and replace all the colors. handleOnClickSaveSVG = () => { const { color } = this.state; let svgToSave = this.svg.state.loadedText; svgToSave = svgToSave.split(fill="${dynamicColor}").join(fill="${color}"); svgToSave = svgToSave.split(stroke="${dynamicColor}").join(stroke="${color}"); const blob = new Blob([svgToSave], { type: 'image/svg+xml' }); const url = URL.createObjectURL(blob); downloadElement(url, 'illustration.svg'); }; Download that blob! downloadElement = (url, name) => { const tempLink = document.createElement('a'); tempLink.href = url; tempLink.setAttribute('download', name); document.body.appendChild(tempLink); tempLink.click(); setTimeout(() => { document.body.removeChild(tempLink); window.URL.revokeObjectURL(url); }, 100); }; Saving as a PNG starts like the SVG by replacing the colors. I create a canvas and draw in a new Image then use my previous function downloadElement() to get it. handleOnClickSavePNG = () => { const { color } = this.props; const DOMURL = window.URL || window.webkitURL || window; if (!DOMURL) { this.setState({ error: 'Your browser doesn\'t support download' }); } let svgToSave = this.svg.state.loadedText; svgToSave = svgToSave.split(fill="${dynamicColor}").join(fill="${color}"); svgToSave = svgToSave.split(stroke="${dynamicColor}").join(stroke="${color}"); const blob = new Blob([svgToSave], { type: 'image/svg+xml' }); const url = DOMURL.createObjectURL(blob); let match = svgToSave.match(/viewBox="0 0 (\d+\.?\d) (\d+\.?\d)"/m); const width = match && match[1] ? parseInt(match[1], 10) : 500; const height = match && match[2] ? parseInt(match[2], 10) : 500; const tempCanvas = document.createElement('canvas'); tempCanvas.width = width; tempCanvas.height = height; const ctx = tempCanvas.getContext('2d'); const pngImage = new Image(); pngImage.onload = () => { ctx.drawImage(pngImage, 0, 0); DOMURL.revokeObjectURL(url); const imgURI = tempCanvas.toDataURL('image/png').replace('image/png', 'image/octet-stream'); downloadElement(imgURI, 'illustration.png'); }; pngImage.src = url; }; With that, you have all the tools you need to do an editable SVG gallery! I hope it was clear, feel free to ask on Intercom or info@manypixels.co if you want more information. ... Read more
ManyPixelsMar 21, 2019

11 Ways to Use Illustrations to Grow Your Business in 2019 (with Design Examples)

Illustrations are a great way to capture visitor attention and add value to your content. We've compiled 11 ways to use illustrations in 2019 to grow your business. 1. Header illustrations Probably the most popular type of illustration: Show. Don't tell. Having a unique illustration in your header can tell your visitor about your service or product (and probably help with bounce rate too!) but not only, it can help with your branding. enter image description here By Valeria Rimkevich 2. Coming soon illustration If you do not have time to fully code or launch your service or product, a good way to validate future demand is to create a coming soon page with an illustration. Coming soon pages are faster to create than landing pages and you just need to communicate your value proposition / an email capture form and a beautiful illustration to get started. enter image description here By Dmitrii Kharchenko 3. Blog post illustrations Blog post illustrations really help to share your content over social media or simply to make the post more attractive (like this one!) Here are some of our favourite styles of blog post illustrations: enter image description here By Magda Koscianska enter image description here enter image description here By Margarida Mouta enter image description here By Sloan enter image description here By Magda enter image description here By Tubik enter image description here by 初夏Ruby doodleillustration 4. Features / product in action illustrations Another way to use your product is to show characters using your product / service. enter image description here By Dmitrii Kharchenko 5. Blog post promotion Facebook ad One way to use illustrations is to retarget visitors from your website with an ad linking to your blog post. Wrike is an work management solution that creates a lot of content and then use Facebook Ads to retarget it. blogpostad 6. Ebook chapters illustrations So you've created an Ebook? Now create small illustrations for each chapter! chapterillustration 7. Illustrations for different use cases Another way to use illustrations is to create a Use Case page to show how your product or service may benefit certain type of clients and why. Slab is making good use of illustrations for their product. enter image description here By JT Grauke 8. Social media post illustration Another way to create engaging content on social media is to use illustrations for your social media posts. This is an example from Tech In Asia socialmediapostillustrations 9. Long-form content illustrations A very good example of long-form content and guide illustrations in action is found on the site of Backlinko, a marketing blog which recently wrote a guide about keyword research. They first start with a very clear header and bullet points to show what they'll talk about: longformcontentillustrations Which is immediately followed by a clear call-to-action which prompts users to subscribe to the newsletter to download the PDF: calltoactionillustration Followed by a small illustration set for each chapter: chapterillustrations And each chapter has its own illustration as well: mainchapterillustration All in all, it really makes the article structured and a pleasure to read which probably helps rank Backlinko content higher in Google (try googling Keyword Research for example!) 10. Carousel ad illustrations Another popular form of illustrations (especially on mobile!) is to use them in carousel ad. Here are some examples from Flock, a communication and collaboration tool for teams. carouselillustration 11. Illustrations for infographics infographicillustrations Probably the most popular : Using illustrations for your infographics. infographicillustration ... Read more
ManyPixelsMar 12, 2019

The Ultimate SaaS Design Trends of 2019

This week we have looked at popular SaaS (or as-a-service type of companies) and compiled a very curated list of trends and design inspiration. From logo inspiration, to illustrations, to some landing pages styles, this guide should give you a solid base to start your SaaS projects in 2019. We've also included some further resources below to tackle your SaaS design projects, so make sure to check them out! 1. Minimalist, simple, elegant, and sharp logos (and purple is insanely popular) In 2019 the trend seems to be around SaaS logos that are minimal or simply font-based with slight tweaks. Purple and dark blue are also colours widely used as they represent trust / luxury and thus convey a high-quality service. Here are some examples we've particularly liked: saaslogo by Keene Niemack by saaslogo2 by Deividas Bielskis saaslogo3 by: https://dribbble.com/shots/5267924-Bread saaslogo4 by Chase Turberville https://dribbble.com/shots/5344854-Marketo-Rebrand simplesaaslogo by Eddie Lobanovskiy 2. Font-based logos (with or without symbols) Another trend are logos that can be used in multiple ways (with or without a symbol) and that are mostly very minimalistic. Some of these logos have just a small font tweak (see DesignModo) simplesaaslogo2 by Eddie Lobanovskiy or saaslogofonts by Aaron Poe or designmodologo by Paul von Excite 3. Soft illustrations Let's now dive into our favourite topic - illustrations. While we had between 2016 and 2019 a slight overload of isometric illustrations (do not worry - they still look great and we do have them on our website!), there seems to be a surge of new type of illustrations. The first type of illustrations are soft illustrations (or soft line illustrations) which seem to be incredibly popular. For example, Canny, a popular feedback tool (and, virtual high-five on them, fully bootstrapped!) used them in their header. These illustrations usually use cold colours or very soft / pastel colours. softillustrations Here is another example: softillustrations by Andrey Kovalev 4. Illustrations with people A very trendy type of illustrations are those which look like these, which were done for Prospa, a small business owner financing app. These illustrations usually use warm colours and are very entertaining. peopleillustrations by Andrew McKay Another style are the ones done by Will Beeching for FlatFair, a tenant/landlord relationship app. peopleillustrations Or this one: peopleillustrations2 by Udhaya Chandra 5. Minimalist animated icons Again by Prospa, these state icons are very cool (and animated) animatedicons 6. Illustrations with pencil style Gusto, a SaaS which is a Payroll-as-a-Service recently revamped their homepage and features a unique style of illustrations which we really loved! illustrationpencilstyle by Camellia Neri Which looks pretty good! illustrationpencilstylesaas 7. Animated illustrations Another popular trend are illustrations with simple animations, which certainly helps to grab more effectively the visitors' attention and deliver a great experience. animatedillustrations by Sofy Dubinska or animatedillustration2 by Alegria 8. Large hero illustrations The trends for landing pages (and not only for SaaS ones) seems to have large hero illustrations. An example is this one by Tubik Studio: largeheroillustration by Tubik 9. Clean UI with crisp and clean fonts The trend for SaaS landing pages (which deserve an entire blog post on its own) seems to be geared towards very clean pages, with crisp fonts which are very easy to read. cleanlandingpages by Casey Kennedy The same goes for SaaS dashboards: saasdashboard by Stan Yakusevich 10. Further resources Ready to tackle your next SaaS redesign or simply want to start from scratch? Check out some interesting resources below: For your UI projects, we recommend using design systems. For example, Shopify released Polaris which is widely used by SaaS companies. It can save your designer (and developer) a ton of time to design your MVP or your fully-fledge SaaS landing page / app. Icons8 recently created a gallery of free illustrations made by top Dribbble designers, with different styles. You can find it here. Alternatively, you can also use our free illustrations gallery as well (we're constantly updating it and open to suggestions!) Land-Book is our go-to resource for SaaS Landing Pages. The collection is really well curated and features landing pages that follow (or create) the trends.... Read more
  • 1
  • 2
  • >

Tags

Clear all
Top

Featured Posts

June 2019 Design Ideas.png
June 2019 Design Ideas
15 examples.jpg
7 Types of Presentation Design to Grow Your Business (+ Design Examples)
Blog-Banner2.jpg
7 Ideas for Your Next Facebook Ad Campaign (with Design Examples)
Need graphic design help?
Get your personal designer today for $399/mo. No interview, no contract, unlimited design.
Learn More