editorial on Ashley Kolodziej - Boston Freelance Web Designer

Decked-Out Dorms and Office Artifacts Design

ashley@lastletterdesign.com (Ashley Kolodziej) — Fri, 16 Oct 2020 21:00:39 +0000

Live links

Decked-Out Dorms Story with hotspot interactivity

Office Artifacts Story with hotspot interactivity

Visual Goals

The BU Today team requested a new look and feel for their Decked-Out Dorms and Office Artifacts series, as well as an updated method of adding hotspots to images that took less manual work than before. Part of what struck me about this series was how creative students got with decorating within university constraints - very punk in my mind. I chose a chunky typeface, angled alignment, and SVG animation to breathe life into the dorm tours.

Design portability

I purposefully designed this to have a consistent look and feel across the Office Artifacts series as well, which showcases faculty and staff offices. Both use similar SVG treatments and the same codebase.

Editing experience

Because of budget constraints, I was unable to build a custom Gutenberg block for this series. However, I did want to make sure that the interface was still somewhat easy to edit for the staff at BU Today, who have some comfort with coding. To do this, I created a JSON object to hold structured information on each hotspot. When the page loads, I used JavaScript to pull in this information and generate the hotspot and lightbox for each hotspot when the user clicks. Some technical challenges here included adding event listeners to dynamically generated content, animating the SVG banner image, and creating an easily editable interface for highly variable content on a minimal budget.

The Good Life of Marcia Deihl

ashley@lastletterdesign.com (Ashley Kolodziej) — Sun, 13 Mar 2016 20:11:28 -0500

View the story design on Bostonia

It’s been a while since something I’ve done has gotten personal.

You know the feeling - when something is important, and it’s really important, but it’s not even just important to you. It’s important to everyone.

I read this article, and I knew it was going to be that kind of project. At one point, my schedule was looking sort of crowded, and there was talk of another designer getting the article, and my heart was just ripping out because I knew I had to do this right, and not that I don’t believe in my coworkers, but what if they just don’t get it, you know? I took every ounce of my strength and determination and heartbreak to casually suggest to my project manager: “Well, I’m not working on anything else just yet this week, why don’t I get a head start on the design and we can go from there?”

I did the whole article.

Designing for something you’re so invested in is difficult. Everything I read resonated with me. I’ve thought a lot over the past year about what it is that makes your career important, and like Marcia, I came to the conclusion that it isn’t glamour. I want to be a good person and help people be more tolerant and understanding. I think a lot about what I leave behind and what I use. I wish others did too. And here it was, an opportunity to help tell the story I wish more people understood.

It’s the first time in a while I’ve wondered if I would really be able to do one of my projects justice. There is no dancing around the fact that this is an article about death. It makes you ask some difficult questions about your own life. You wonder, why her?

How do you even design for that?

I knew a focus on photos, like we normally take with these articles in the header image, wouldn’t be appropriate. So many In Memoriam type pieces show a person, lively and pretty, in their prime. And it’s not to say Marcia didn’t have that, but the true impact she had on me was through her words and her beliefs. I had a few glimpses of her journals, and I knew if anything should be the visual focus of the article, it should be those.

The article, in some sense, feels like a conversation between Susan and those journals. I knew I wanted to animate Marcia’s writing in. I wanted it to feel like she was there with you, commenting, laughing along. I put in writing and scribbles and notes exactly where, if Susan was explaining my life and I was helping tell the story too, I’d interject a comment. That part was easy.

At one point, I toyed with the idea of a single, slow doodle, pacing along, abruptly veering off violently and fading away. I couldn’t put it in. Even in my head, it felt way too real. So in the design, she just stops writing. I thought about taking her writing back away once you hit the part where they talk about her funeral, but I couldn’t bring myself to do that either. She was important. Her ideas shouldn’t be lost.

Presenting this was brutal, because I really cared a lot about this one. I was confident this was the right direction, but afraid I wouldn’t be able to see it through. I’m lucky that I work somewhere that lets me run with my ideas.

Without the article, I had a couple of people note the animated writing was cute, neat, and the like. Once the article text came in, I suddenly got words like haunting and understated. Bingo.

I hope I did her story justice.

This article ran in the winter-spring 2016 issue of Bostonia. I was responsible for design and development of the web version of the article, which uses SASS, Javascript, and GSAP to animate in Marcia’s writing through SVG.

This article was recognized with a 2016 Bronze Hatch Award in Websites: Editorial.

View the story design on Bostonia

Every Cell Has a Story

ashley@lastletterdesign.com (Ashley Kolodziej) — Wed, 06 Jan 2016 22:00:00 +0000

I was lucky enough to be able to work with the amazing Joe Chan on this one. After I read this article, one thing stuck out at me, and it stuck out hard: how much dedication do you have to have to look at cells dividing for days on end? I really wanted to capture that and make it the centerpiece of the article.

If you’ve ever sat down, and done something, and then looked up and it’s suddenly hours later, you know what I mean when I say you do something like this, and time is different for you. That’s what the design for this article is all about. I wanted everything to feel endless and repetitive, but captivating.

View article as launched on archive.org | Current version

Constitutional Amendments

ashley@lastletterdesign.com (Ashley Kolodziej) — Tue, 20 Oct 2015 20:15:30 +0000

Constitutional Amendments is an article about the restoration of the U.S.S. Constitution. I used nautical elements and gentle motion to bring a refined feel to the restoration process. I was also lucky to be able to work with a talented illustrator for a portion of the article.

Typography details

Integration of custom illustrations

See the full article here.

Dubious DNA

ashley@lastletterdesign.com (Ashley Kolodziej) — Wed, 22 Jul 2015 00:00:00 +0000

The heart of this piece I designed on DNA profiling focuses on a researcher who is working to improve the reliability of DNA profiling for crime scenes. Throughout the article, she calls into question the many factors that may cause incorrect profiling - leading to the grim possibility an innocent person could be convicted.

Extract genetic material from sweat on shirt collar
Was the shirt borrowed?
DNA from at least three people
Can we isolate this?
Check for skin cells
DNA degraded by heat?
Testable DNA tricky to get from hairs on couch
How many people picked up that magazine?
Is this evidence related to the crime?
Who was in the apartment last week?

In my design, I let these questions hang in the air uncomfortably around the crime scenes they inhabit, much like the dust, skin cells, and flecks they raise concerns about. I’m using a subtle keyframe animation on top of each photo to create the slight animated noise effect.

To create the right look and feel, I worked with Janice Checchio, an amazing photographer and art director on the Boston University photography team, to get a gritty, noisy look to the images, and to take photos of everyday objects which both aligned with the story’s content and could conceivably be found at a crime scene.

Some of the animation relies on JavaScript, but in the pullquote above, I used a gif that I created in Photoshop instead to improve performance.

Low copy DNA – weak genetic signal
DNA from at least three people
Can we isolate the suspect’s DNA?
How do we make sense of all this?
Perfect DNA match to suspect unlikely
Will this be enough DNA to identify a suspect?
Is it possible to get a clean DNA signal?
Signal could be from someone else
Testable DNA tricky to get from hairs on floor
How many people have been through here?

Even minor movements by the user (either phone tilts or mouse movements) disturb the scene; it is deliberately delicate.

High Notes

ashley@lastletterdesign.com (Ashley Kolodziej) — Tue, 01 Oct 2013 16:00:00 +0000

High Notes is a behind-the-scenes article about opera singer Michelle Johnson’s performance at the Met. I used bold, bright colors from her costumes against dark backgrounds and serifs to create an elegant, yet dramatic visual piece.

Selected design moments

View the live article here.

It's a Date, I Think

ashley@lastletterdesign.com (Ashley Kolodziej) — Wed, 03 Jul 2013 21:00:00 +0000

View the live article on Bostonia

Selected for inclusion in the 49th Publication Design Annual, published by the Society of Publication Designers