Difference between revisions of "Category:Tools"
Jump to navigation
Jump to search
Line 5: | Line 5: | ||
* [http://pxtoem.com PX to EM] converts pixels to Ems | * [http://pxtoem.com PX to EM] converts pixels to Ems | ||
== | |||
== Code == | |||
* [https://caniuse.com/#search=placeholder CanIUse] tells you which browsers support the HTML/CSS/JS capabilities you want to use, so you can plan accordingly. | |||
== Color == | == Color == | ||
Line 21: | Line 23: | ||
* [https://www.colorcombos.com/combotester.html?color0=484452&color1=F8F2DA&color2=C7AFBD&color3=DDECEF&color4=99aacc&color5=88CA8E Color Combo Tester] lets you put a few columns of colors next to each other while fiddling with a palette | * [https://www.colorcombos.com/combotester.html?color0=484452&color1=F8F2DA&color2=C7AFBD&color3=DDECEF&color4=99aacc&color5=88CA8E Color Combo Tester] lets you put a few columns of colors next to each other while fiddling with a palette | ||
== | == Content Generators == | ||
''For image generators see Stock Photography below.'' | |||
* [https:// | * [https://lipsum.com/ Lorem Ipsum generator] - the original content generator, with options for any length and layout of information. | ||
* [http://johnclendvoy.ca/honestipsum Honest Ipsum] when someone complains about Latin, you put in dummy text that says "hello I am dummy text" | |||
* [https://www.behindthename.com/random/random.php?number=4&gender=both&surname=&all=yes Behind the Name: Random Name Generator] - my favorite tool for generating persona names | |||
* [http://www.unit-conversion.info/texttools/random-string-generator/ Random String Generator] for when you need garbage GUIDs and such. | |||
== Converters == | == Converters == | ||
Line 31: | Line 37: | ||
* [https://sketchapp.com Sketch] is my preferred wireframing tool. That's a big deal, because I thought I'd probably wireframe in Photoshop or Visio (!!) for my whole career. | * [https://sketchapp.com Sketch] is my preferred wireframing tool. That's a big deal, because I thought I'd probably wireframe in Photoshop or Visio (!!) for my whole career. | ||
* [https://www.omnigroup.com/omnigraffle Omnigraffle] is my preferred every-other-diagram too. I do process flows, site maps, and everything else under the sun in it for work. For home I do everything from timelines (it's kind of hard for timelines) to sketches of the new deck, to family trees or "what is that neighbor's name?" maps. | * [https://www.omnigroup.com/omnigraffle Omnigraffle] is my preferred every-other-diagram too. I do process flows, site maps, and everything else under the sun in it for work. For home I do everything from timelines (it's kind of hard for timelines) to sketches of the new deck, to family trees or "what is that neighbor's name?" maps. | ||
==CSS== | |||
''See [[:Category: Cascading Style Sheets]]'' | |||
==Stock Photography== | ==Stock Photography== | ||
===Diversity-aware stock photography=== | ===Diversity-aware stock photography=== | ||
* [https://tonl.co Tonl] | * [https://tonl.co Tonl] | ||
===Stock photo generators=== | |||
* [https://placebear.com Placebear] - my favorite photo generator, with big colorful bears | |||
* [http://lorempixel.com Lorem Pixel] | |||
==Time Management== | ==Time Management== |
Revision as of 11:33, 14 June 2018
Design tools I love to use. And by "love" I mean I choose these over the alternatives every time.
Calculators
- PX to EM converts pixels to Ems
Code
- CanIUse tells you which browsers support the HTML/CSS/JS capabilities you want to use, so you can plan accordingly.
Color
Favorites
- Hex-to-RGB and RGB-to-Hex are quick color converters
- Paletton makes building a color palette easier, especially since it includes colorblindness tools
- WebAIM Color Contrast Checker is there to make sure your colors have accessible levels of contrast.
See Colorblindness for additional color tools and Category: Cascading Style Sheets for CSS tools that make gradients and stripes and the like easier.
Other tools
- Pictaculous generates color palettes based on a photograph you upload.
- Color Combo Tester lets you put a few columns of colors next to each other while fiddling with a palette
Content Generators
For image generators see Stock Photography below.
- Lorem Ipsum generator - the original content generator, with options for any length and layout of information.
- Honest Ipsum when someone complains about Latin, you put in dummy text that says "hello I am dummy text"
- Behind the Name: Random Name Generator - my favorite tool for generating persona names
- Random String Generator for when you need garbage GUIDs and such.
Converters
- Pandoc is a command-line tool for converting from one file format (such as HTML) to another (such as MediaWiki)
Deliverables
- Sketch is my preferred wireframing tool. That's a big deal, because I thought I'd probably wireframe in Photoshop or Visio (!!) for my whole career.
- Omnigraffle is my preferred every-other-diagram too. I do process flows, site maps, and everything else under the sun in it for work. For home I do everything from timelines (it's kind of hard for timelines) to sketches of the new deck, to family trees or "what is that neighbor's name?" maps.
CSS
See Category: Cascading Style Sheets
Stock Photography
Diversity-aware stock photography
Stock photo generators
- Placebear - my favorite photo generator, with big colorful bears
- Lorem Pixel
Time Management
- Asana is my preferred to-do / agile / kanban board. (It does both multi-column boards *and* plain lists.) It also will timeline things that have dates on them. I currently use it to track both my work responsibilities (through work boards that are funded) and my writing/fiction responsibilities (through a free board). When my Asana boards are up to date I feel like I have some bit of control over my life.
UX Thinking
- Category:Design Principles is an ongoing and growing list of design principles and heuristics I use to validate my work
Wiki
- EmbedVideo Extension lets me embed videos in this here wiki.
Pages in category "Tools"
The following 2 pages are in this category, out of 2 total.