Tag Info

New answers tagged

0

You can also use this script https://gist.github.com/TomByrne/7816376/ It export layers in Illustrator in separate SVG.


1

Alright I'll try to help you out, in Illustrator. First recommendation is to split screen when you design. Start with settings: Now do: - Window → New Window. - Window → Arrange → Tile Set up one of the windows as Actual Size and work in the other:


2

16x16 is a very small small amount of space for creating anything with detail. This is the size of favicons you see at the top of your browser window. You will notice how simplistic the icons are. Here are some ideas to think about 1-2 colors max, if using 2 colors, make sure they contrast like B&W (This is only a suggestion, you can certainly use ...


0

There's no right answer to this. What icon you should use here is likely heavily dependent on the rest of the icons in your app. All that said, I don't think a hand with a finger makes any sense as an icon here, as it's communicating what to do, rather than what it is. I'd suggest using a front-desk bell: https://thenounproject.com/term/bell/79519/


0

You could use an icon similar to the phone field strength (I mean, the 3-5 vertical bars that indicates the quality of a phone call) as seen in many video games. You could change the icon depending on the ping.


3

I think the best solution might be to not have a ping icon at all. I have an app that connects to a server (a computer) over bluetooth. Once the connection is made, there are chances that the connection drops I’ve spoken to a developer friend and Bluetooth disconnect/connect are events your app can register for. That seems like a far more sane way to ...


0

I like your approach but I think it's halfway there. The hand gesture is great but it doesn't represent the the action result will be a ping. Here's a few suggestions (roughly done):


1

Forget about Pathfinder or joining or any of that.... it seems you may be over-thinking this. It's vector, right? All you need is one more anchor on the circle path, that's it. Use the Pen Tool to add an anchor on the bottom circle path. Then use the Direct Selection Tool to click and drag that anchor downward creating the arrow. Then delete that angle ...


1

Use two closed shapes; using the polygon and circle tools instead of a path and shape. Combine the shapes using the unite option in the Pathfinder palette.


1

There is no tool that can automagically do this in one action. Both drawing slices in PS and drawing artboards in illustrator are sane options. The EPS format itself gives no structural guarantees for ensuring that this in fact can be done. A software could be made to do this. How well it would work depends on strategy used. For this case its pretty trivial ...


1

Someone else said Illustrator but didn't really go into a lot of detail. Open the eps in Illustrator. Use the select tool (key command v) to drag a box around the icon you'd like to convert. Go to object > artboards > fit to selected art. The rest of the image will remain but won't be included in the png. From there go to file>save for web and devices ...


3

Automation would be a waste of time unless you need to do this on a lot of images. The easy thing to do in Photoshop, is to drag out guides into a grid enclosing your icons. Then use the slice tool. Select the slice tool and look in the Options bar. There should be an option for "Slices from Guides". Then Photoshop will let you save each slice and assign ...


-3

Open in Adobe Illustrator. Create artboards underneath icons. Export artboards as PNG.


1

a factory silhouette with an "i" in the middle? a document/open book (like a catalog)? If the tab is product-specific, why not just use the information circle with an i inside it? Or replace the tab with an information button next to the item title.


0

So, as I commented on the original post I could see some kind of tools icon, possibly placed over something representing the information part, like an "i" or instructional booklet. Some examples of the direction I'm talking about: 1, 2, 3, 4. Now, knowing that the site sells specialty sporting goods equipment I think you can customize it for that even ...


1

Should I design each resolution independently?? It depends on the icon. Flat, bold line art can probably be designed as an SVG and just scaled as needed in the app/website. This is how icon fonts work...they are just vector icons and resize as needed. On the other hand, if it's a photo-realistic icon with fine details, then typically the process is: ...


0

If you're already using font awesome, can't you use something like the 'List' icon? http://fortawesome.github.io/Font-Awesome/icon/list/


0

Why not mix in another framework? I find semantic-ui to be much easier and superior to bootstrap. They also have a much wider range of icons. http://semantic-ui.com/elements/icon.html Take a look at that page in particular under maps there is an icon called building. This might work well to represent an organisation. If you have any issues with this leave ...


3

As @Bennett McElwee also points out, the checkmark is something we're getting more and more used to in our interfaces. Also the asteriks is used to indicate something that's not saved. We might combine the two into one button that changes state depending on the state of the document that it refers to: (icons adapted from ...


1

Downloadable UI guides are available for Android wear from the Android developer site. There's also loads of other information about design principles, structuring and a whole range of other thing in the "wear" section. Apple also provide something similar for the Apple Watch if anyone is looking for that as well, It's called WatchKit. The downloadable ...



Top 50 recent answers are included