by Tim Brown on September 10, 2014
- 1. Pen and Paper – I almost always sketch out ideas and layouts on paper first, so I can see the most basic elements and get a strong idea of what my direction will be.
- 2. Photoshop – Bringing it into the digital arena and messing with any design elements that make sense to do in a photographic element before I get to CSS and HTML.
- 3. Illustrator – So many UI elements can be made and utilized in code from illustrator. SVG’s and beautiful sharp PNG’s allow me to do anything that otherwise doesn’t make sense to do in CSS and HTML. Illustrator has quickly become my favorite program to do layout in.
Editing Code and Version Control
- 1. Sublime Text – This code editor is basic but expandable, and in my opinion it is the premiere editor of code at this point, and I see alot of evidence from other developers that is true for alot of people.
- 2. Sublime Text Plugin: Sublime Linter – Expand Sublimes ability to ‘Lint’ or predict and improve the syntax of your code writing.
- 3. Sublime Text: Plugin: Sublime FTP – Tap into FTP right from Sublime. Although Sublime is basic, so many people are using it that they’ve expanded it’s capabilities and given it superpowers. This is a seriously radical plug-in that saves me a bunch of time.
- 4. Sublime Text Plugin: Sublime Git – Because I’ve been working on many projects on my own and/or handing them off after a phase I haven’t used a ton of Git but when I’m doing more work with version control, you best believe I’ll want Git functionality right from my text editor.
- 5. Sublime Text Plugin: Git Gutter – Chatting with a friend recently he turned me on to ‘Git Gutter’ which allows you to see your changes or ‘Git diff’ in your gutter in Sublime Text.
- 6. Filezilla – For times when I haven’t set up Sublime FTP for a particular site, Filezilla is my old fallback to quickly and somewhat painlessly connect to FTP and upload some files.
User Testing and Feedback
- 1. Asking for feedback from those around me – I don’t hesitate to ask for fresh eyes on websites and projects I’m working on. This occasional painful openness to feedback has made all the difference for my design chops and the rate at which I’ve been able to improve.
- 2. UserTesting.com – I can’t know for sure if my design is connecting for people and working as we intend, and as they intend for it to work. This tool allows me to define questions to ask non-designers and have them check out the site and to determine any usability issues from a general standpoint.
- 3. Inspectlet – Take a look at the real users of your website. What are they really doing? If you read my blog on a regular basis I may have watched your session! Weird and creepy I know. But if you had problem navigating in a particular region, and I saw you navigating on my site, you best believe I’m doing my best to fix it.
Social, Outreach, and Content
- 1. Buffer – This is probably the most important social media application out there today. Get suggested times to post when there is high interaction frequency, schedule out your tweets and find content that’s relevant to your audience to share.
- 2. Twuffer – Essentially a slimmer version of Buffer, I use this when I want to have a bit more targeted time to post a tweet but want it to be separate from my regular social media schedule that I’m doing on Buffer.
- 3. Inbound.org – Inbound.org is more for your content discover than anything. Content marketers contribute and upvote the best pieces of content.
Branding and other design tools
- 1. Wordmark.it -This tool allows you to see a particular word or phrase in all of the fonts on your machine in a clearly laid out and easy to look at way.
- 2. The Ultrabright – Color Forecast – I can’t get enough of fashion and natural color palettes that are curated for the current design trends and a broader tasteful style.
- 3. Design-Seeds.com – This shows design palettes as they are drawn from a particular photograph. You can search by a particular shade, maybe be prepared to modify according to your purpose even though they might be tempting to take and use in their ready-made format.
- 4. Dribbble.com – Get inspired. I also go to Dribbble for color palette inspiration on a regular basis.
- 5. Various free stock photo sites – Regularly finding new tools to utilize for stock photos, and these site cover a wide range of focuses. I’d really love a site that takes the best of the open-license stock photos available on the web that is more searchable.