Use icon maker + sketch65 to make a beautiful AppIcon under Mac, with download link

effect

Let's take a look at the finished picture first, which is more concise:

Sketch make text icon

Pick

First find an app you like (such as facebook), and then we use sketch+icon maker to make an appicon for ios.

Make

The steps to make a facebook-like icon (based on Sketch 65) are as follows:

1. Download and install the sketch (link: https://pan.baidu.com/s/1GQmoHH4OhT5FoFnbtAEocg
   password: e0if)

2. New document

3. Create a new background. Click: Place-"Shape -" Rectangle, set the size to 512x512 (just keep it square), set the background color to gradient (click 1), and then click 2 and 3 respectively to set the starting color of the gradient (#59ABEB ) And the ending color (#2E64DC), the effect is as follows:
   

4. Insert text. Click: Insert-"character, drag the character position to the middle of the background color, adjust the font size (I am 500 here)
   

5. Export. File-"Export, an exported layer will be generated at this time, adjust the layer size to 512x512 (the same size as the background rectangle above), x and y are 53,23 respectively (click the background rectangle to view the coordinates). Then click OK.

At this point, an icon is ready and can be used directly, but in IOS, it is too troublesome to cut icons of various sizes, convert them in one meal, and then drag them into the project one by one. Therefore, we can find a tool to complete the image cutting and project resource file generation.

icon maker

1. Download and install icon maker (link: https://pan.baidu.com/s/1j2WZSJ83RYu6hLnK4ICSYw password: 1t9p)
2. After opening the icon maker, select the png image you just exported, check the Rounded Corner to generate the rounded corner icon, and click IOS to select the storage location.
   
3. Finally, copy and replace the generated folder IOS/Assets.xcassets/AppIcon.appiconset to Assets.xcassets/AppIcon.appiconset in our program directory, recompile and run, and the icon will be ready!
   

Recommend a few tools

Color circle: http://www.peise.net/tools/web/

Mobile application APP icon design series: Chinese font deformation design: https://www.25xt.com/appdesign/16366.html

Alibaba icon library https://www.iconfont.cn/

About the author

Recommend your own open source IM, written in pure Golang:

CoffeeChat：
https://github.com/xmcy0011/CoffeeChat
opensource im with server(go) and client(flutter+swift)

Referred to well-known projects such as TeamTalk and Guazi IM, including server (go) and client (flutter+swift), single chat and robot (micro, Turing, Sizhi) chat functions have been completed, and group chat functions are currently being developed , Welcome friends Star who are interested in golang and cross-platform development of flutter technology to pay more attention.

————————————————
Copyright statement: This article is the original article of CSDN blogger "Xu Fei", and it follows the CC 4.0 BY-SA copyright agreement. Please attach the original source link and this for reprinting. statement.
Original link: https://blog.csdn.net/xmcy001122/article/details/105665732