Wisdom from “Advancing The Careers of Technical Women (ACT-W)” New York 2017 Conference
Or How a Woman’s Tech Conference Saved My Butt
Kind of on a whim, I decided to attend the Advancing The Careers of Technical Women (ACT-W), 1-day conference. The purpose was to provide career advice for women in all parts of the tech world, not just for developers. Overall, it was incredibly inspiring and energizing, which I really needed. Job hunts can be very depressing.
In an upcoming post, I will share detailed notes from each speaker. But for now, I will share some highlights and how I’ve applied the advice I learned from attending.
Highlights of Wisdom, Summarized
build a community; don’t network
create an objective panel of reviewers
tell your unique story
diversity of opinions and experience is important
earn trust
ask for help
be honest
Taking Action
Examples of how I applied the advice I learned by taking action:
1 – BUILDING A COMMUNITY
I immediately started applying the concept of community building. I got some business cards and names, from a few attendees, and I connected with them on LinkedIn and sent emails. I’ve even been reaching out to complete strangers on LinkedIn!
Coincidentally, this was kind of happening in real life, too, which made everything a little overwhelming but also provided another opportunity to try out these new ideas.
2 – ASKING FOR HELP
I decided to ask for help from people I haven’t tried before. For instance, I reached out to employers that rejected me for a job, to ask for help. Either to ask what they look for or to ask for career advice.
3 – BUILDING TRUST
I’ve been working on redoing my website (again) and this time, I included more information highlighting my expertise. Not to brag, but to build trust.
4 – TELLING MY STORY
As a part of redoing my website, I’ve included an About page. I’ve used part of that page to go into more detail into my background and how I got to where I am.
My new “About Me” page has a “My Story” section.
My next post will include detailed notes from the speakers.
It might not be easily noticeable from this blog, but over the past few weeks I’ve updated my main website. I tend to do this a few times a year, as I gain feedback, or learn what works and what doesn’t work. Hopefully this change will stick around for a while. This post is documentation of what I did and why.
Research
Over the past several months, I have been trying to get a better understanding of what UX managers look for when they view a candidate’s portfolio. There were a few resources I looked at that helped inform my opinions in this regard. After reading a few articles and slideshow presentations, reviewing websites, and gathering feedback, I had a few ideas. Here are a few points and screenshots demonstrating my ideas and how they affected the design.
I. Overall Design and Home page
One way or another, I ended up looking at a few portfolio pages from designers I’d met in-person or came across online. Despite reading several of those “10 UX Portfolios To Admire” articles, what I’ve discovered is that sometimes simple is best. And that translates to a template site, often paid.
Paid subscription services are anything from $6-$8 or more each month. I don’t think someone should have to pay a monthly fee in order to apply for a job. That meant I’d have to create it myself or use a free service. I’ve used Carbonmade, Coroflot, and even Behance (barely), which are all free. But their designs are limited and my research showed that managers will evaluate candidates on the usability of their portfolio, even when it’s hosted by a third-party.
Reviewing both free and paid sites, the ones I liked best were made by the paid services Squarespace or Wix, using remarkably similar templates. Essentially, that template was a site with basic navigation, a grid of projects on the home page, project pages, and a simple About page. Following that template, I came up with a basic grid for my home page. But I jazzed it up a bit with some fancy CSS throughout the site.
II. Presenting an Overview
In previous designs, I assumed that managers would read. But, my research showed that they might spend 30 seconds reviewing a portfolio, for the first time. I also came across numerous resources insisting that candidates outline role, problem or goal, and outcome when presenting their work.
So you can see in the screenshot below how I’ve outlined this information right at the top, next to an image.
Overview of the project and role, along with keywords. This image is actually a screenshot from the company’s website, promoting the product.
II. Fast Scanning
Another consideration was the amount of time a manager spends reviewing a portfolio. My research showed that managers only spend 30 seconds on a portfolio and review 12-50 portfolios for a given position. I used the process/approach section to break up information into digestible, one-sentence long chunks.
An earlier version of this section was a 3-column layout, with longer paragraphs. Breaking it up makes it easier to scan. Fontawesome does this, also, on their homepage. http://fontawesome.io/
III. Tell a Story
The word “storytelling” is thrown around a lot, especially in relation to self-promotion. I think “storytelling” is overused and cliche, and I’ve written about storytelling a few times. However, for the redesign, I thought about the concept of beginning, middle, and end. Thinking through these part of a story, I ended up with the following sections: overview, a process/approach section, documentation, and outcome. Outcome really helps “sell” it as a story, because it provides a conclusion.
Outcome
Having talked about outcome, what now?
One idea I thought of, as I was writing this, was to shrink the size of the thumbnails on the home page to show more information on the screen. But, I think the “hero” image/section is what takes up most of the space, vs the size of the thumbnails. This is one change though; I have a running list of updates and ideas on Remember the Milk, where I can also track priority.
I plan to ask more friends for feedback and maybe get feedback from a few connections on LinkedIn. It was fun, I learned a lot. I look forward to adding more projects and the site evolving over time. Or until I redesign it again!
OK, XYZ Foundation is not really the name of the organization. But I really was asked to complete a UX challenge for a job application.
Since it helped me get through to the 2nd round, I thought it would be nice to share it. The challenge description (from them) and my submission (from me) are indented and given a different color.
Kudos to them for choosing a challenge that had nothing to do with the company itself. They don’t have anything to do with food or supply distributions.
UX Challenge
Scenario We are building a tool to connect restaurateurs and chefs with food and kitchen equipment distributors. We want both groups of users to have the capacity to search for one another and set requirements in order to get their needs met. Also, each set of users should have the capacity to record and broadcast their needs or resources so that other users can browse through them.
Task We’d like to see a plan for how you would go about assessing the needs of the various users, collecting and studying similar projects and potential competition, and designing and testing the experience of this tool’s users. We are expecting a roadmap for what steps will be involved in conceiving, developing, and testing the design of this tool.
My only clarifying question was what “record and broadcast” meant. They estimated this to take 1-2 hours, so I didn’t try to go into too much depth.
Submission
I wasn’t really sure who would be reviewing this, or how it would be used. Ostensibly, this was just for them to understand if I really understand usability. But if this was real, and I had been asked to create a plan, I wasn’t sure if they would use this as a formal plan or as a general outline.
So, like going to a party where you don’t know the dress code, I decided to go a little more formal with a report using a Google template.
New restaurateurs and chefs expanding or creating a new restaurant need kitchen equipment to stock their kitchens. Kitchen supply distributors (KSDs) want to be able to find restaurateurs looking for kitchen equipment.
Goals
1 – Restaurateurs need to be able to search for equipment and post requests for quotes.
2 – KSDs can search for restaurateurs and send quotes.
Potential Solution
Online exchange where restauranteurs can search for supplies, as well as post request for quotes from participating KSDs. KSDs can search for restauranteurs and send quotes. Perhaps a Craigslist for restaurant equipment. There may also be a weekly newsletter with new requests.
Note:
Below are milestones that would be part of the design process for this tool. In the real world, constraints such as the budget and release date would have a bigger impact on the functional scope and timeline. Also, the actual process might not be this clean, or steps might be skipped or combined, as needed.
Milestones
1. High-Level Process Map / High-Level Research
Create a basic high-level map of the process, to get a fuller picture of the scope of the problem. High-level research of kitchen supply distributors, to get a sense of what they do and offer. (See example, below.)
2. Stakeholder Interviews
Interview 2-4 restaurateurs and 2-4 distributors. Analyze finding and create personas if needed.
3. Research kitchen equipment distribution sites
What do these sites do well, what do they do poorly. How are their times organized and catalogued. Probably will return to this list often.
4. Create list of tasks tool should support
Decide on the scope of the tool. Don’t need to work on everything at once, but have a sense of the bigger picture. This is also a time to figure out the overall information architecture.
5. Create workflow for first task(s)
Pick one section of the tool, and sketch or list out a more in-depth workflow. For instance, what is the post process for chefs? What is the search and reply process for suppliers.
6. Create a draft of wireframes for task(s) – repeat
Sketch wireframes and create a first set of wireframes for whichever tasks were identified in part 5. Use these documents to meet with internal teams regarding feasibility, scope, business strategy, research, and timeline.
7. Refine designs / Prototype
Use feedback from internal meetings to refine wireframes, as needed. Progressively getting more detailed. Create a prototype, if possible.
8. Usability Testing
Return to earlier users, or sample of users, to test prototype or designs. Update design based on feedback. Could also try paper prototypes, between step 6 and 7.
Example: High-Level Process Map / High-Level Research
Sketch of a high-level workflow for overall concept.
1 – Chef wants to open a restaurant. 2 – Thinks about his needs.
3 – Option 1: Goes online and searches for supplies. 4 – Pays for items. 5 – Items are delivered.
6 – Option 2: Chef fills out a form or posts needs online. 7 – Distributors get or view the request. 8 – Distributors create bids/quotes for chef and send them. 9 – Chef reviews options and picks a quote that works. 10 – See 4. 11 – See 5.
This overview can be digitized, if it needs to be shared out.
So when I was doing this project, I had this image set up in InDesign, ready to go. But, I kept skipping over it because I couldn’t figure out what to do with it. I really like this image, but it’s difficult to use because there’s so much going on.
In one of John McWade’s courses, he creates a business card for a flight instructor. And I thought, Hmmmm, I could invent a business to design for! And that’s what I did.
Rather than an airline instructor, I chose a travel agent or guide, specializing in unusual destinations or adventure travel. The company I created was called “Apex Travel”, given that the image is at the top of a mountain or hill. I chose the tagline: Travel differently.
I didn’t have a clear idea in mind of what I was ultimately going for, but I ended up created a kind of wordmark.
Results
Here is a WIP version, with guidelines in place. I ended up smushing the letters together, creating my own ligatures with the P and the E, the R and the A, and the V and the E. I also was careful to track the letters as well as I could. I used InDesign for this project.
Black and White
Finished version, b/w
Finished versions, color
I then used the landscape image, by inserting it into the letters.
Landscape, white
Landscape, black
Finally, I attempted a business card, which the travel guide would need. Probably needs a little more work.
Critique
Finished version, b/w
When I look at this now, I think the space between the A and the V kind of stands out. This is also the same amount of space as between the top of the E and the L. Of course, a good idea would be to simply fix this before posting, but in order to paste the landscape into the words, I had to create outlines. So I could do it, but it would be time-consuming at this point.
Final Thoughts
I really enjoyed all of these projects, the poster and magazine layout. Even though the business card didn’t turn out as well as the others, I enjoyed the process of creating it and the wordmark for Apex Travel.
Continuing with my ongoing education in design, I focused recently on typography and layout. And I went through two Lynda.com courses to do it.
Those courses are called Learning to Set Display Type and Learning Graphic Design: Set Perfect Text. They are both taught by John McWade.
The classes John McWade teaches are exceptional because he is such an excellent instructor and quite good at explaining the concepts he is trying to get across. I recommend both of the classes I mentioned above, as well as other classes in the Lynda library by this instructor. Here are previews of these two courses.
Neither of these classes include exercise files. But after watching both of these courses I was inspired and motivated to try my own type projects, to put his advice into use.
Type Rules I Learned
It sounds basic, but I wasn’t aware that some fonts have additional glyphs that can be used instead of the regular font. Bookmania is an example of a font with tons of extra options for letters.
I also learned about justifying text, using hyphenation and spacing to help words fit. I also learned about using hair-spaces and thin-spaces, and using drop-caps.
Actually, the class doesn’t go into how exactly one would create a dropcap. So, I turned to YouTube – or as I like to call it, the second internet – to find another tutorial.
And I found one. This one is actually by another Lynda instructor, Anne-Marie Concepcion. She makes it look so easy.
As soon as I learned how to do this, I wanted to try it right away. Voila!
Type Stuff I Made
dropcaps
Now we’re getting to the fun part. First is the dropcap I made after watching the YouTube video.
Used Bookmania and a Lynda tutorial to create a dropcap.
In this one, I was able to move the text corners so that the text flowed around the dropcap R. Looks cool.
I was inspired to use the extra glyphs in Bookmania to create my own name. I used the smallcap version of the letter ‘A’ in the word, “alliwalk”.
Projects with Images
I like to collect stock photos – I know, it’s a bad habit – because I think that someday I’ll use one for a project. So, I end up with many stock photos that I don’t use. (Sometimes I use them here on my blog.) Well, I was finally able to put a few to good use.
All Dressed Up
The first is this nice “Man in a suit putting on a tie”. I wasn’t sure what I was going for. Maybe a book cover or magazine spread. But, I think what I have is some sort of flyer concept.
This image uses Bickham Script Pro and Didot.
This image uses Bickham Script Pro, which has tons of fancy glyphs, and Didot. Didot has a certain fashionable sense to it, and I think it works. I wanted this to have a bespoke aura about it, yet still masculine. The italicized Dido, and the extra swirls from Bickham Script Pro help to get that across.
New rules of computer technology
BarryW90-Black, BarryW90-Thin, Futura Medium, and Minion Pro
In this case I wanted to use justified type, as John McWade had shown in his course. I stuck with Minion Pro, because it was easier to work with. And I added in a few random elements – a few numbers, some quotes, some pronouns – just to incorporate some of the lessons from the course. One thing I wasn’t able to replicate was keeping the subsequent letters from the word in the dropcap closer than the other words on lines 2 and 3. InDesign just wasn’t cooperating for me.
But I did enjoy this project. BarryW90-Black and Thin are highly stylized, very technical-looking fonts. I was inspired to find a new stock photo for them. Something computer-oriented.
Next time…
In my next post, I’ll talk about a few more projects in InDesign, and another type/logo(!) project I made for a fake company I invented called Apex Travel.
At some point, I came up with the idea that reading 10 articles on one topic was a good idea. Well, I only made it to 7. But these 7 articles, on LESS and 404 pages, were very helpful for me so I’m still glad I read them.
Getting inspiration and a sense of best practices while creating my own 404 page. I have to say, Bloomberg’s is hilarious. (Creative Bloq, October 10, 2016)