Artwork

Content provided by Cathi Bosco. All podcast content including episodes, graphics, and podcast descriptions are uploaded and provided directly by Cathi Bosco or their podcast platform partner. If you believe someone is using your copyrighted work without your permission, you can follow the process outlined here https://player.fm/legal.
Player FM - Podcast App
Go offline with the Player FM app!

Episode 11: Pushing more than Pixels

34:32
 
Share
 

Manage episode 188008937 series 1567421
Content provided by Cathi Bosco. All podcast content including episodes, graphics, and podcast descriptions are uploaded and provided directly by Cathi Bosco or their podcast platform partner. If you believe someone is using your copyrighted work without your permission, you can follow the process outlined here https://player.fm/legal.

In this episode, I’m chatting with Cathi Bosco. Cathi is the creative genius that powers her web studio in Madison CT USA.

We’re talking all about collaboration on projects, lessons learned and some of our favorite design elements. She shares her industry knowledge and experience to help us forge a way forward in this ever changing digital age.

Let’s get started.

Meet Cathi Bosco

Cathi BoscoCreative Director, Digital Consultant, Web Designer, Artist, Illustrator, Children’s Book Author, trail runner, dog lover & free thinker…

My specialty is creating beautiful and cohesive web presence packages for clients that can convert audiences and present content elegantly (think modern and clean presentation). Our sites are built on The Genesis Framework and they function exceptionally well for a wide range of programs, communities, organizations and companies.

If you have an unusual challenge – we are all ears… tell us about your project and ideas! We don’t take on each and every proposal that comes along, but if we feel we can add value to your plans or programs, we’ll gladly get you a quote and get to work for you.

I also think CSS transitions and CSS + SVG animations are very effective slightly below the surface. Designed to feed the human reward system. Always leaving the end user ‘in control’ of the navigation but royally rewarded aesthetically. This is for upper-end projects and can also help to differentiate sites from low-end, non-custom work… when done well. We all love this stuff… transitions and animations that are so subtle they beautifully and intriguingly enhance end user experiences. Along with collaboration, they are key to forward momentum for Genesis developers and designers

Show Notes

Bio Page: About Cathi
Company site: CandDStudios.com
Twitter link: @bethebreeze

A Few Valuable Links & Resources :



Complete Transcript:

Open PDF version of this transcript in new window

Jackie: Hey everybody, it’s Jackie D’Elia with Rethink.fm with another episode for you, and today I have my guest Cathi Bosco with C&D studios. Hi Cathi.
Cathi: Good morning. Good morning.
Jackie: Good morning to you. Thank you very much for joining me. I’m really excited to be able to chat with you today.
Cathi: Well, it’s my pleasure. I’m pretty excited to be talking about front-end design more, and rethinking the way things are being done, so I love it.
Jackie: Awesome. Well for folks who don’t know you, what do you do?
Cathi: Well, I run a creative design studio here. I’m in Madison, Connecticut, and I’ve been self-employed, freelancing, doing this work for, gosh, almost 20 years now. I’ve sort of ridden the digital evolution. I started analog as an illustrator, drawing in the studio, gradually got split between analog and digital.
Now, we’re doing almost all digital work. I got involved with WordPress because I’m a trail runner and I run with a group of crazy wild animals, and one of my chief runners ended up being a really good mentor to me, and brought me from drawing into WordPress for our team site.
He’s very involved with IT, Jerry, and he’s taught me to manage the team website, years and years ago. I just kept learning and doing more, and doing more, and doing more websites, and people referring me, and learning.
Now we do full-time, upper-end, mid-end, low-end web development design: logos, all kinds of photography, product shots, e-commerce, everything. That’s the long story short.
Jackie: What percentage of your work that you currently do now involves WordPress for your clients?
Cathi: Well ,all of the websites we develop are developed on WordPress, but we do a lot of the supporting work, as well. We do all of the imagery, logos, slogans. We have a copywriter we bring on to jobs. We work with other company’s copywriters and tech departments. We do all of their social media, graphics, stylizing. We do a lot of training with clients so that they can manage things on their own.
I spend a lot of time bringing clients up to speed with more recent, better ways to do things. I think that’s really leveraged our studio to offer that kind of training and teaching to people has given us a real advantage.
Jackie: Do you find that you get a lot of referrals from existing clients? Is that how you’ve built up your business?
Cathi: Exclusively.
Jackie: Wow.
Cathi: Exclusively. The only advertising I do … I fell into this as an annual activity. Friends or non-profits or really good charitable causes will come to me and say, “Could you, out of the goodness of your heart, make a website for us?”
Sometimes it’s a relative or something, and you’re like, “You know, I can’t because I’m really busy and I’m not really making enough money that I can just give my work away for free.”
Every year, in January, we allow people to nominate themselves for a free website. A free web presence package ’cause I’ll give them some social media stuff and e-mail marketing and tips like that, too. I give one free site away to one applicant, and that’s my advertising expense for the year.
This year, we did a science talk. It’s a coffee chat, science talk group out of New Haven, Connecticut called Tilde Café. It’s a non-profit. They bring in the most incredible speakers every month or every couple weeks to talk about science and bring it into every day conversation level: high science.
Her group got the free website this year. Those are kind of fun because you can … Because it’s free, you can kind of play around a little bit. Add a few things, make it your way, you don’t always have to make it the client’s way, but she was great to work with. That was entire advertising expense this year other than giving back to the community and doing some design work or logo work for fellow devs.
Jackie: That’s awesome. Do you typically just give away for non-profits or is it anybody? Small business?
Cathi: It could be a small business. It could be a non-profit. The year before, we did a children’s book author. We created a website for her, so she had a better platform for her book. She’s had many, many books published over time. She’s a great teacher: BoyWereWeWrong.com. She has a whole series of books.
Her books are published in Mandarin and all over the world. When you do a site like that, you can get a nice portfolio piece and people share your work and word of mouth, so that’s been great for me. It all started with the running club site ’cause all of my peers got to see that site.
Jackie: Now I want to ask you … You come from a graphics design background, right?
Cathi: Right.
Jackie: I’m just curious, how do you approach design for your clients? Say you have a client that needs a new website or new branding. How do you typically approach working with your client and collaborating with them to find out exactly what’s going to be the best design for them?
Cathi: Well, it involves a lot of listening and talking back and forth. Then looking at inspiration in the wild of things that resonate so that I have visuals to show them of where we think we need to go. Everything starts with the logo for me in terms of design. Logo, slogan, that sort of thing, and everything just builds off from that.
Those logos need to be, well, ideally, SVGs, right?
Jackie: Awesome. Yes.
Cathi: Scalable vector graphics. The logo itself has to be a vector graphic so it can be used on the coffee mugs, or their hats, or whatever they need it for in their industry. Then it has to tell the story of what they need told about what they do.
It all starts with that, and then we start talking about the imagery, and photos, and then we do photo shoots, and we start building the story you want to tell. There’s nothing worse than trying to get people to go to a symphony orchestra, when you’ve got a picture of a man standing in an empty room, with a giant orchestra hall behind him.
I prefer imagery that tells us what it’s really like to experience that and be there and be part of it, with people enjoying the concert. That translates that really exciting moment when everybody plays the first chord. That’s what you want to sell, not a silent, empty, orchestra hall.
I sort of try to give clients a new way of looking at things. I think that’s what artists do. They give you a new perspective or a new way of looking at something. That’s a big part of my role with clients.
I love that work, and I love collaborating with developers more now, because then I can do that work instead just worrying about coding. It’s been nice to get to the stage last year. Last year, I was at a stage in my career where it was like, “All right, I’ve really got to get better at coding, or I’ve gotta start collaborating with someone who wants to just work behind the scenes more, and do the code work, and maybe not interface with clients as much. Who’s not a designer.”
I had to do one or the other. I couldn’t do everything, so I got good enough at code that I could tell if a dev really had the skills that we needed for a certain project or not, and that was critical.
It’s hard to tell what devs are good at what things. I collaborate with Joe Julie, regularly. He does a lot of the back-end, custom development stuff for client projects. I’ll subcontract to him, and he’ll subcontract to me sometimes, depending on where the job comes from. That’s been going terrific. I have to learn not to just keep pinging him in Slack. This question, that question, this question. I have to give him a sheet with all the questions.
The communication learning is important when you collaborate. I also collaborate with Rita Best. We’re doing web applications and mobile apps and things now for clients, so I’ve got a couple of good collaborations.
The orchestra, for example, that I work for, I want them to have an app eventually.
Jackie: Do you think you’ve reached a point in your business where collaborations has a lot of benefits for you? Is it helping you get larger projects, things that you could not do by yourself? I know you had mentioned to me, when we were chatting previously, that you had done this mobile app with Rita Best, and that you had done this project for your client, and that sounds like something you probably would not have tackled on your own.
Now it creates a lot more value add for you. How do you kind of know when you’re at that point where collaboration is gonna make sense?
Cathi: Well, I mean, like everything, I’ve learned the hard way. I’m like, “Hoh! I’m drowning underwater. I need help!” I mean, honestly, that’s pretty much how I figured it out, but now I’m smarter and I know better.
Yes, so this app that we created for a chiropractor is a program. It’s a reminder app that her patients use to remind them to change the elastics in their braces, so it’s for kids, and it’s a little reminder that sends push notifications to their phones.
They’ll use the app for a while and then they won’t need it anymore. We’ll be adding some more functionality to that. That’s just a really simple, basic app, built on WordPress, that I needed Rita’s help with, so now Rita and I, we just are ready to go crazy with this kind of stuff. ‘Cause it’s so much fun.
It’s another business vertical. It really is. In many ways, it’s bigger than website development in terms of the personalization, integration, and all of the resources you’re calling upon to make it work.
Jackie: Where do you see value going forward with clients? I know I’ve talked to a lot of folks lately about just doing WordPress websites, the design and the development of a website is just one part of the services that you can offer clients that really add value.
Where are you seeing the most needs from your clients that you’re able to provide those additional services and strengthen your relationship with your client?
Cathi: Well, it depends on the clients, so up until this last year or two, I had like a lot of small clients. The pizza guy. His needs are pretty basic. He needs to be able to tweet out his daily specials and manage his own website.
Now, when you’re working with a larger scale clients like universities or industry leaders that are international. Those big jobs. Those are completely apples and oranges. I’m focusing more on the larger jobs because I’d rather do two or three or four or five large jobs in year, then have 15 or 20.
It’s just a nice change for me. We get to do bigger things. One of the things that I’ve started doing, which I’m really excited about, is style guides. Living style guides. I have an e-commerce client, and I’m building style guide for them. It’s women’s sports apparel company: SportPort Active.
We’re gonna do a style guide for them so that all designer or social media provider or agency that works for them, doing their work, they can just refer to the style guide. Pull down a logo, pull down a slogan, pull down code, styles for buttons on the websites, all that stuff, ’cause everything is digital for her. Everything is one the website. There’s no brick and mortar.
Creating these living style guides, put in their SVG icons, put what are allowable animation, activities. You only want animations to trigger on loading the page, on scrolling, or hover. Put those restrictions in so the company itself isn’t always trying to keep everybody on the same page with meetings. You can just pull it up online. You can see what all that is, and pull it down. Keeps everybody working in harmony.
Creating style guides is some place I’d like to be doing a lot more work.
Jackie: What do you use to create your style guides with? How are you putting this all together?
Cathi: Well, we’ve been using Frontify, which is a service, Frontify.com. That’s one. Pattern Lab has a nice set of style guides. It’s kind of new to me doing these really formal style guides with larger companies, but it’s terrific.
It’s just like when you make a website for a small business. It makes them evaluate all this stuff, but when you do a living, breathing style guide with the company, they have to evaluate and complete and style and all this stuff, and it makes it beautiful for the developers.
The developers can then just refer for the style guide for code, page design, messaging, content creators can. It’s just critical, so I’m working on adding that as business service that I offer more, and honestly, I’d love to talk to more front-end designers, too, to see what they charge for this. ‘Cause it’s hard to charge for this service for me, not having done as much of it in the past, and it depends on each client. Because each client’s job is a per project scale.
Jackie: Do these style guides you put together, is this typically after you’ve done a project with them, or you getting ready to do a website for a client, and you’re putting together some kind of preliminary style guide as a way to define how the website’s gonna be built?
Cathi: Right, originally, I always do like a preliminary one, but as a service, I want to provide them with a real style guide that covers everything for them. That is one of the service verticals you’ll get in your website, you’ll have all your social media graphics, and your e-mail template created.
A lot of times we’ll do a lot of photography for clients, illustrations. Any icons that we make, and then we build out a style guide as well as part of the package for upper-end jobs. It’s one of the deliverables at the end is the style guide.
Jackie: Are most of your clients local in your area? Sounds like if you’re doing photography shoots for them, it sounds like they could be in your area and local.
Cathi: Well, some of them are, but sometimes we’re hiring photographers on location and, no, most of my clients are not local anymore. That’s good and bad. I like getting in the same room.
Jackie: How ’bout risks on collaboration? We were chatting about that, and when you first start off, and you’re just by yourself, you’re working with client, you can manage all of that because you are that relationship. What things you need to be mindful of as far as protecting your brand and your relationship with your client. Are you having to do project management for these? How do you manage that risk?
Cathi: My role is typically that of onboarding with clients, talking with them extensively about the project, presenting the proposal, going over any questions. I bring the developer in for a kick starter meeting so that we can all make sure we’re on the same page after proposal’s been accepted.
Then I do the project management, so I’m the one telling the client like, “Well, we’ll have that done Friday, and you know, things happen sometimes.” There’s a leap of faith. There’s a trust element there that I feel for my side, and I’m sure my developers do, too, because they expect certain things from me in terms of communication.
Like I said, they don’t want them to ping them every hour as I think of something that needs to be done. They want me to send them a sheet. I’ve learned the hard way that that’s the way to work. That communication and trust back and forth, too, make sure with the lay person who might be the end client, chief level officer on their board, does not mean they know anything about developing a website for development or what we’re talking about.
I end up being the communication gap between the client and the developer, and filling that. That’s part of my job. I do the design work, then it gets developed, then we deliver it. I’ve doing a lot of the maintenance work, but I’m looking forward to maybe off loading that to developers instead.
Jackie: How big of a effort is put on content creation with clients? I’m asking this because clients seem to have difficulty with creating content for their website, especially small to medium businesses do.
Even the larger ones seem like they just … You can’t wrangle people enough to have time to get the information that you need, how do you manage that process throughout your development?
Cathi: It does vary, again, with small jobs and big jobs. Like corporate jobs, when you’re doing jobs for corporations, it’s like how can you get like people who work at the job to all agree on what should be on the site? That’s the biggest challenge in those jobs.
One of the great things about working with, Joe, for example, is he’s SEO certified, so he can do some keyword research, and search what the competition’s doing for clients. They love that. It really motivates them to write their copy because they can wrap their head around the power of that and the competitive nature of that.
One of the greatest things last year was using HotJar. Have you used HotJar before?
Jackie: Yes, I have.
Cathi: It’s fascinating. You can record how people use websites, really useful in e-commerce. I love seeing how people are navigating around on sites and how they’re using it. When we show clients that, it also motivates them to care about what they’re putting on there.
Strange, so the competition gets them going. I know some studios are very strict. They won’t even start designing until they have copy in hand, and I can understand why it gets to that point.
Jackie: We were chatting one day about e-commerce sites and how much more work is involved in putting those together than just a traditional website for clients, and that many of us have underpriced those in the past, not realizing how much time and energy is gonna go into rolling out an e-commerce site.
Can you share your insights on-
Cathi: Oh, man. I’ve underpriced so many jobs. I’ve learned everything the very hardest way you can learn it, which I suppose is a good way ’cause you learn it, but it’s incredibly time consuming, and it also matters how much the client’s gonna be managing after you deliver the finished site and how much you’re gonna be managing.
Jackie: How ’bout educating your client on the extent of a project of this size for an e-commerce? How do you communicate to them what’s really involved in building an e-commerce site? Other than just adding a shopping cart and some items.
There’s a lot more to this.
Cathi: There’s a lot more to this. I charge them for that training time. We schedule days where we sit down and we have like sessions, either virtually on the computer, or I’ll go to their offices, or they’ll come here sometimes.
My desk is a big table. It’s a classroom setting here. When I tell them the training time, it doesn’t take long, as the training begins, for them to recognize that, “Whoa. This is a lot.”
There’s variations, and pricing, and competition, and search engine optimization, and AdWords, and retargeting ads, and social media, and all of those kinds of things are extremely time consuming.
Once you start doing Google Ads on a e-commerce site, or anything like that, you are constantly going in back in there, and like refreshing it. Just like you take care of your plants, you clean them, and you water-
All has to be nurtured, so I use the garden analogy a lot. I’m like, “You let it go to the weeds, you got weeds.” You’ve gotta keep taking care of your garden, and they all laugh at me when I say that, but it’s really true. It’s a living, breathing thing.
Jackie: Yeah, I think that’s very true for e-commerce sites, especially. Now, even just traditional websites, they still need maintenance.
If you’re trying to rank in search engines for articles you’re writing, for content you’re producing, whatever it is, the reason that you have your website for, it’s a living, breathing thing, you have to keep revisiting that all the time. You can’t just publish it and forget about it.
Cathi: It’s fluid. Things are changing, the person that they’ve been relying on to do it might not be up to date with what really should be happening with it. It’s treacherous out there, but it is a living organism in an ecosystem called the Internet.
That’s what I like about the series of atomic style sheet because it goes from atom to molecule-
Jackie: Brad Frost.
Cathi: Brad Frost. Yeah. It’s great, it’s great. That’s been really good for me to see and think about the way he’s working with clients. I’d like to know how he charges for style guides, too. I’m gonna have to ping him up and ask him about that.
Jackie: I think you should.
Cathi: I think I will.
Jackie: I think that’s a great idea.
Cathi: I will. I have a few resources to share with you, or design work. One is Rafal Tamal’s site, Typespiration. Have you used that before? Have you seen that?
Jackie: I have seen that yes.
Cathi: It’s very useful for inspiration. You can get typesetting situations, see them displayed, and he gives you the code with it, which is great. I love all his stuff, and I love all of the CSS animation on the cover of his website. Huge fan, very subtle, hover over it, and then you see a little bit more.
It’s just very royal. I always like the way he uses everything, so his stuff is good. The “A Book Apart” series … I’m in the middle of “Practical SVG” by Chris-
Jackie: I just got that one, too, and I’m reading that as well.
Cathi: It’s so great, and he’s responsible for Code Pin, right?
Jackie: Yes. Chris Coyier.
Cathi: Yeah. Yeah, right, so CodePen, if developers or designers have not used CodePen before.
Jackie: I love CodePen. It’s great.
Cathi: Take a couple days off for the week and plan to get lost over there for a while.
Jackie: Examples to see and to explore, and I love that you can just live edit it and play with it. It’s a great educational tool to understand how code works, even just some simple things that you can do. It’s awesome.
Speaking of SVG, I know you’ve mentioned that. I’ve been really interested in incorporating that a lot more into my work, and I know you have. We’ve chatted about it several times, and it seems like we’re coming to the point where it’s becoming much more mainstream.
CSS Animations and Transitions was a course that I took on Treehouse by Guil Hernandez, which I loved that one. It was very good. It really helped me understand how use it, when to use it, what are the benefits of that.
Some of the downsides of this are, and we were chatting about it is, when is too much on animation and transitions on a website? What’s your philosophy on how you’re approaching it?
Cathi: Right, right. We talked about this a lot. I agree. Those are great videos and it helped me. ‘Cause we’re in parallel universes. We’re learning some of this stuff along the same tracks. Well, I think it can be way, way, way too much. There’s something that triggers the human brain when it sees motion. It’s called “fight or flight.” Hunt or kill, that kind of thing, and I’d never want to trigger that stimuli to someone.
I don’t want to increase any sort of stress level for an end user on a website, ever. I think that the transitions in animation should be kind of under the surface a little bit. They should be a really magical reward for someone who’s beginning to actually participate in the site.
Little reward systems like on hover, or on load, something happens, very like, “Oh, let me see that again,” or “Oh, this is … This is pleasing and feeding my human reward system and it makes me want to, A, come back to the site again, B, go further in the site.”
A designer or an artist can design it to enhance the overall message mission of that particular site. If it’s a membership site or if it’s a corporate site, whatever the angle of that particular site is, it should all feed that tag, that slogan, that mission, that work. It should all be part of that same style guide and plan.
I really think that it can help with engagement. It can also help if you can collaborate with a friend and designer like yourself or someone to bring this to your site. You just don’t want to get involved with it. You’re not a designer. You can’t tell what looks visually pleasing. You can’t connect it to that business’ mission.
Well, collaborate with someone like a friend in design, or an SVG expert, or an animation expert. Someone who does that well, and you’ll be able to leverage up and get bigger jobs and better jobs ’cause you can charge for that service.
Some of my local guys can’t maybe afford that kind of styling, but you go for bigger jobs that way.
Jackie: Do you think that some subtle animations can help with accessibility as well?
Cathi: I gotta really work hard to understand accessibility better. I had the privilege of learning about accessibility in terms of color blindness when I was working with Rian (Rietveld) and Gary (Jones) on some stuff, so I understand that, and contrast ratios, and color work.
I don’t fully understand the accessibility parts that go along with animation, so that’s on my list of things to learn. I think Sara Soueidan has a lot of information on that, too. I love her site Codrops. The reference guide there, so we’ll put that in the notes, too, for everyone.
I need to learn more. I need to learn more. There’s just not about hours in the day.
Jackie: The challenge that I had like when I was doing Rethink’s logo, ’cause I wanted the gears to turn on the logo, and of course, it’s a WordPress site, so you gotta get the logo into the code, so that you can animate it.
You can’t animate it if you’re just using it as an image for an SVG, you actually have to bring it in, so I had to write a little plug-in to do that to get it to come in. Once I started working with it, I realized, okay, it’s a lot of just CSS and HTML, really. You’re just assigning classes and identifiers into your SVG elements, and then you can assign CSS transitions and transforms to them to get them to animate in there. The same way you do on a PNG file, but you can do a lot more because you can change colors in them. You can do a lot of things with an SVG that you cannot do with a PNG or anything else, or even just a basic image in there.
I do like … Maybe if you hover over an image, it just enlarges just a little bit slightly. That I have to check with Rion on, whether or not that’s a thumbs up … If that improves accessibility or not. I’m thinking it might trigger to somebody, yeah, there’s something here that’s changing here. There’s something that’s clickable here. I’ll have to follow up and find out with that, but I do like experimenting with those things.
I totally agree that you don’t want to go overboard with those things.
Cathi: Yeah, it really makes a huge difference, but you’re amazing. You’re like, “Oh, and I wrote a little plug-in to do this and do that,” and I’m like, “Why. Wait, wait, that’s not nothing.”
Jackie: Actually, that plug-in was very small. It was not a lot of lines of code at all, but it enables you to use a short code to embed the XML code into your WordPress page or post, so that if you choose to do something to do it.
Maybe you just want to change the color of it when you hover over it. Like if wanted to use SVG icons or something, and you wanted to be able to make those kind of changes where it would need to be in the HTML in order to be able to do that. That plug-in was the beginning of my work on that. I later figured, then, okay, if I’m in places where I’m not gonna be using a short code, well then I can use that code to embed it programmatically in widget areas and things like that.
That worked out really well. That was a great, fun project to do.
Cathi: Yeah, yeah, it’s awesome. It’s really great. I’m always working, breaking things down. It’s like, when I first started, I was an illustrator, so I needed a website to get my portfolio online, so that’s how I got involved with the web to begin with.
‘Cause I’m so old, we didn’t even have digital photography in college. It was analog. We did filmmaking the old way. I’ve been lucky. I’ve been able to ride the wave and I have unique perspective because I’ve experienced both ends of that, which a lot of people don’t have that opportunity. They get left behind actually.
Some of the design elements I’m gonna share with you, too. I’m gonna write in my blog post that are so basic and fundamental, I was stunned by how much of my work is removing stuff, stripping it down. Do all these mock-ups and designs. Then I’m just like, “Remove this, remove this, remove this, remove this, remove this,” so I never thought that my work would be about removing stuff and stripping things down.
I always thought being a designer, being an artist, sculptor, it was additive. I’d put this together, I’d put that together. We’d add all these resources, and that would be what this type of work is, but design work is very much the opposite.
There’s some of that, but it’s really once you have all the resources, and dissolve all the problems, design work is about removing stuff.
I want to share some design elements with you guys about position on the page, overlap, density, saturation, size, scale, color. I’m gonna do a little graphic to share, too, that will give non-designers, like a little cheat sheet.
Jackie: This is gonna be the show notes I’ve had so far. I’m really excited about this.
Cathi: Little cheat sheet for you.
Jackie: Awesome, and you’re gonna write a blog post, too, you had mentioned summarizing some of the concepts that you’ve been working on. Look forward to sharing that as well.
Cathi: Yeah, I really want to see Genesis devs doing more with SVG animation and CSS animation. I think it’s the key to taking us up to the next level, even more, because it’s obviously the best framework. Everything we do is on Genesis.
Jackie: Me too, and I saw you were in the Genesis Slack channel, and you were chatting about … I think they were talking about themes and a lot of the Genesis themes don’t have the animation and some of the more interesting designs, I guess, from that perspective. They’re certainly doable, and just taking that little extra time, if you’re gonna be changing a color or underlining something or doing something on a harbor, to just add a little bit of transition time and can make all the difference in how smooth things move along on the site.
I think a lot of us don’t take that time to add those extra things in.
Cathi: Right, and when we big jobs and projects, we need to budget for that time, and budget for that kind of thoughtful, composition work I think. That’s what I would encourage everyone to do.
Jackie: Yes, and making sure you’re supporting all the browsers and everything else. That all needs to be taken into consideration.
Cathi: Yes, all of that.
Jackie: Yes, absolutely. I wish we had more time. We’re already at the end here, Cathi. I so-
Cathi: Aw thanks.
Jackie: … enjoyed-
Cathi: I rambled on.
Jackie: No we both did, but I so enjoyed chatting with you. Thank you again for being on the show. If folks want to get in touch with you and find out more about what you do, how can they reach you?
Cathi: Sure. They can reach me at CandDStudios.com or CathiBosco.com, either one. Thank you. Thank you for shining a bright light on some of these front-end opportunities. You’re welcome. Thank you. Thank you for being on here. You’re the one that’s making it possible.
Jackie: Well, I hope you have a great week, and I’ll see you next time. Thanks.
Cathi: Thanks Jackie.
  continue reading

39 episodes

Artwork

Episode 11: Pushing more than Pixels

rethink.fm

0-10 subscribers

published

iconShare
 
Manage episode 188008937 series 1567421
Content provided by Cathi Bosco. All podcast content including episodes, graphics, and podcast descriptions are uploaded and provided directly by Cathi Bosco or their podcast platform partner. If you believe someone is using your copyrighted work without your permission, you can follow the process outlined here https://player.fm/legal.

In this episode, I’m chatting with Cathi Bosco. Cathi is the creative genius that powers her web studio in Madison CT USA.

We’re talking all about collaboration on projects, lessons learned and some of our favorite design elements. She shares her industry knowledge and experience to help us forge a way forward in this ever changing digital age.

Let’s get started.

Meet Cathi Bosco

Cathi BoscoCreative Director, Digital Consultant, Web Designer, Artist, Illustrator, Children’s Book Author, trail runner, dog lover & free thinker…

My specialty is creating beautiful and cohesive web presence packages for clients that can convert audiences and present content elegantly (think modern and clean presentation). Our sites are built on The Genesis Framework and they function exceptionally well for a wide range of programs, communities, organizations and companies.

If you have an unusual challenge – we are all ears… tell us about your project and ideas! We don’t take on each and every proposal that comes along, but if we feel we can add value to your plans or programs, we’ll gladly get you a quote and get to work for you.

I also think CSS transitions and CSS + SVG animations are very effective slightly below the surface. Designed to feed the human reward system. Always leaving the end user ‘in control’ of the navigation but royally rewarded aesthetically. This is for upper-end projects and can also help to differentiate sites from low-end, non-custom work… when done well. We all love this stuff… transitions and animations that are so subtle they beautifully and intriguingly enhance end user experiences. Along with collaboration, they are key to forward momentum for Genesis developers and designers

Show Notes

Bio Page: About Cathi
Company site: CandDStudios.com
Twitter link: @bethebreeze

A Few Valuable Links & Resources :



Complete Transcript:

Open PDF version of this transcript in new window

Jackie: Hey everybody, it’s Jackie D’Elia with Rethink.fm with another episode for you, and today I have my guest Cathi Bosco with C&D studios. Hi Cathi.
Cathi: Good morning. Good morning.
Jackie: Good morning to you. Thank you very much for joining me. I’m really excited to be able to chat with you today.
Cathi: Well, it’s my pleasure. I’m pretty excited to be talking about front-end design more, and rethinking the way things are being done, so I love it.
Jackie: Awesome. Well for folks who don’t know you, what do you do?
Cathi: Well, I run a creative design studio here. I’m in Madison, Connecticut, and I’ve been self-employed, freelancing, doing this work for, gosh, almost 20 years now. I’ve sort of ridden the digital evolution. I started analog as an illustrator, drawing in the studio, gradually got split between analog and digital.
Now, we’re doing almost all digital work. I got involved with WordPress because I’m a trail runner and I run with a group of crazy wild animals, and one of my chief runners ended up being a really good mentor to me, and brought me from drawing into WordPress for our team site.
He’s very involved with IT, Jerry, and he’s taught me to manage the team website, years and years ago. I just kept learning and doing more, and doing more, and doing more websites, and people referring me, and learning.
Now we do full-time, upper-end, mid-end, low-end web development design: logos, all kinds of photography, product shots, e-commerce, everything. That’s the long story short.
Jackie: What percentage of your work that you currently do now involves WordPress for your clients?
Cathi: Well ,all of the websites we develop are developed on WordPress, but we do a lot of the supporting work, as well. We do all of the imagery, logos, slogans. We have a copywriter we bring on to jobs. We work with other company’s copywriters and tech departments. We do all of their social media, graphics, stylizing. We do a lot of training with clients so that they can manage things on their own.
I spend a lot of time bringing clients up to speed with more recent, better ways to do things. I think that’s really leveraged our studio to offer that kind of training and teaching to people has given us a real advantage.
Jackie: Do you find that you get a lot of referrals from existing clients? Is that how you’ve built up your business?
Cathi: Exclusively.
Jackie: Wow.
Cathi: Exclusively. The only advertising I do … I fell into this as an annual activity. Friends or non-profits or really good charitable causes will come to me and say, “Could you, out of the goodness of your heart, make a website for us?”
Sometimes it’s a relative or something, and you’re like, “You know, I can’t because I’m really busy and I’m not really making enough money that I can just give my work away for free.”
Every year, in January, we allow people to nominate themselves for a free website. A free web presence package ’cause I’ll give them some social media stuff and e-mail marketing and tips like that, too. I give one free site away to one applicant, and that’s my advertising expense for the year.
This year, we did a science talk. It’s a coffee chat, science talk group out of New Haven, Connecticut called Tilde Café. It’s a non-profit. They bring in the most incredible speakers every month or every couple weeks to talk about science and bring it into every day conversation level: high science.
Her group got the free website this year. Those are kind of fun because you can … Because it’s free, you can kind of play around a little bit. Add a few things, make it your way, you don’t always have to make it the client’s way, but she was great to work with. That was entire advertising expense this year other than giving back to the community and doing some design work or logo work for fellow devs.
Jackie: That’s awesome. Do you typically just give away for non-profits or is it anybody? Small business?
Cathi: It could be a small business. It could be a non-profit. The year before, we did a children’s book author. We created a website for her, so she had a better platform for her book. She’s had many, many books published over time. She’s a great teacher: BoyWereWeWrong.com. She has a whole series of books.
Her books are published in Mandarin and all over the world. When you do a site like that, you can get a nice portfolio piece and people share your work and word of mouth, so that’s been great for me. It all started with the running club site ’cause all of my peers got to see that site.
Jackie: Now I want to ask you … You come from a graphics design background, right?
Cathi: Right.
Jackie: I’m just curious, how do you approach design for your clients? Say you have a client that needs a new website or new branding. How do you typically approach working with your client and collaborating with them to find out exactly what’s going to be the best design for them?
Cathi: Well, it involves a lot of listening and talking back and forth. Then looking at inspiration in the wild of things that resonate so that I have visuals to show them of where we think we need to go. Everything starts with the logo for me in terms of design. Logo, slogan, that sort of thing, and everything just builds off from that.
Those logos need to be, well, ideally, SVGs, right?
Jackie: Awesome. Yes.
Cathi: Scalable vector graphics. The logo itself has to be a vector graphic so it can be used on the coffee mugs, or their hats, or whatever they need it for in their industry. Then it has to tell the story of what they need told about what they do.
It all starts with that, and then we start talking about the imagery, and photos, and then we do photo shoots, and we start building the story you want to tell. There’s nothing worse than trying to get people to go to a symphony orchestra, when you’ve got a picture of a man standing in an empty room, with a giant orchestra hall behind him.
I prefer imagery that tells us what it’s really like to experience that and be there and be part of it, with people enjoying the concert. That translates that really exciting moment when everybody plays the first chord. That’s what you want to sell, not a silent, empty, orchestra hall.
I sort of try to give clients a new way of looking at things. I think that’s what artists do. They give you a new perspective or a new way of looking at something. That’s a big part of my role with clients.
I love that work, and I love collaborating with developers more now, because then I can do that work instead just worrying about coding. It’s been nice to get to the stage last year. Last year, I was at a stage in my career where it was like, “All right, I’ve really got to get better at coding, or I’ve gotta start collaborating with someone who wants to just work behind the scenes more, and do the code work, and maybe not interface with clients as much. Who’s not a designer.”
I had to do one or the other. I couldn’t do everything, so I got good enough at code that I could tell if a dev really had the skills that we needed for a certain project or not, and that was critical.
It’s hard to tell what devs are good at what things. I collaborate with Joe Julie, regularly. He does a lot of the back-end, custom development stuff for client projects. I’ll subcontract to him, and he’ll subcontract to me sometimes, depending on where the job comes from. That’s been going terrific. I have to learn not to just keep pinging him in Slack. This question, that question, this question. I have to give him a sheet with all the questions.
The communication learning is important when you collaborate. I also collaborate with Rita Best. We’re doing web applications and mobile apps and things now for clients, so I’ve got a couple of good collaborations.
The orchestra, for example, that I work for, I want them to have an app eventually.
Jackie: Do you think you’ve reached a point in your business where collaborations has a lot of benefits for you? Is it helping you get larger projects, things that you could not do by yourself? I know you had mentioned to me, when we were chatting previously, that you had done this mobile app with Rita Best, and that you had done this project for your client, and that sounds like something you probably would not have tackled on your own.
Now it creates a lot more value add for you. How do you kind of know when you’re at that point where collaboration is gonna make sense?
Cathi: Well, I mean, like everything, I’ve learned the hard way. I’m like, “Hoh! I’m drowning underwater. I need help!” I mean, honestly, that’s pretty much how I figured it out, but now I’m smarter and I know better.
Yes, so this app that we created for a chiropractor is a program. It’s a reminder app that her patients use to remind them to change the elastics in their braces, so it’s for kids, and it’s a little reminder that sends push notifications to their phones.
They’ll use the app for a while and then they won’t need it anymore. We’ll be adding some more functionality to that. That’s just a really simple, basic app, built on WordPress, that I needed Rita’s help with, so now Rita and I, we just are ready to go crazy with this kind of stuff. ‘Cause it’s so much fun.
It’s another business vertical. It really is. In many ways, it’s bigger than website development in terms of the personalization, integration, and all of the resources you’re calling upon to make it work.
Jackie: Where do you see value going forward with clients? I know I’ve talked to a lot of folks lately about just doing WordPress websites, the design and the development of a website is just one part of the services that you can offer clients that really add value.
Where are you seeing the most needs from your clients that you’re able to provide those additional services and strengthen your relationship with your client?
Cathi: Well, it depends on the clients, so up until this last year or two, I had like a lot of small clients. The pizza guy. His needs are pretty basic. He needs to be able to tweet out his daily specials and manage his own website.
Now, when you’re working with a larger scale clients like universities or industry leaders that are international. Those big jobs. Those are completely apples and oranges. I’m focusing more on the larger jobs because I’d rather do two or three or four or five large jobs in year, then have 15 or 20.
It’s just a nice change for me. We get to do bigger things. One of the things that I’ve started doing, which I’m really excited about, is style guides. Living style guides. I have an e-commerce client, and I’m building style guide for them. It’s women’s sports apparel company: SportPort Active.
We’re gonna do a style guide for them so that all designer or social media provider or agency that works for them, doing their work, they can just refer to the style guide. Pull down a logo, pull down a slogan, pull down code, styles for buttons on the websites, all that stuff, ’cause everything is digital for her. Everything is one the website. There’s no brick and mortar.
Creating these living style guides, put in their SVG icons, put what are allowable animation, activities. You only want animations to trigger on loading the page, on scrolling, or hover. Put those restrictions in so the company itself isn’t always trying to keep everybody on the same page with meetings. You can just pull it up online. You can see what all that is, and pull it down. Keeps everybody working in harmony.
Creating style guides is some place I’d like to be doing a lot more work.
Jackie: What do you use to create your style guides with? How are you putting this all together?
Cathi: Well, we’ve been using Frontify, which is a service, Frontify.com. That’s one. Pattern Lab has a nice set of style guides. It’s kind of new to me doing these really formal style guides with larger companies, but it’s terrific.
It’s just like when you make a website for a small business. It makes them evaluate all this stuff, but when you do a living, breathing style guide with the company, they have to evaluate and complete and style and all this stuff, and it makes it beautiful for the developers.
The developers can then just refer for the style guide for code, page design, messaging, content creators can. It’s just critical, so I’m working on adding that as business service that I offer more, and honestly, I’d love to talk to more front-end designers, too, to see what they charge for this. ‘Cause it’s hard to charge for this service for me, not having done as much of it in the past, and it depends on each client. Because each client’s job is a per project scale.
Jackie: Do these style guides you put together, is this typically after you’ve done a project with them, or you getting ready to do a website for a client, and you’re putting together some kind of preliminary style guide as a way to define how the website’s gonna be built?
Cathi: Right, originally, I always do like a preliminary one, but as a service, I want to provide them with a real style guide that covers everything for them. That is one of the service verticals you’ll get in your website, you’ll have all your social media graphics, and your e-mail template created.
A lot of times we’ll do a lot of photography for clients, illustrations. Any icons that we make, and then we build out a style guide as well as part of the package for upper-end jobs. It’s one of the deliverables at the end is the style guide.
Jackie: Are most of your clients local in your area? Sounds like if you’re doing photography shoots for them, it sounds like they could be in your area and local.
Cathi: Well, some of them are, but sometimes we’re hiring photographers on location and, no, most of my clients are not local anymore. That’s good and bad. I like getting in the same room.
Jackie: How ’bout risks on collaboration? We were chatting about that, and when you first start off, and you’re just by yourself, you’re working with client, you can manage all of that because you are that relationship. What things you need to be mindful of as far as protecting your brand and your relationship with your client. Are you having to do project management for these? How do you manage that risk?
Cathi: My role is typically that of onboarding with clients, talking with them extensively about the project, presenting the proposal, going over any questions. I bring the developer in for a kick starter meeting so that we can all make sure we’re on the same page after proposal’s been accepted.
Then I do the project management, so I’m the one telling the client like, “Well, we’ll have that done Friday, and you know, things happen sometimes.” There’s a leap of faith. There’s a trust element there that I feel for my side, and I’m sure my developers do, too, because they expect certain things from me in terms of communication.
Like I said, they don’t want them to ping them every hour as I think of something that needs to be done. They want me to send them a sheet. I’ve learned the hard way that that’s the way to work. That communication and trust back and forth, too, make sure with the lay person who might be the end client, chief level officer on their board, does not mean they know anything about developing a website for development or what we’re talking about.
I end up being the communication gap between the client and the developer, and filling that. That’s part of my job. I do the design work, then it gets developed, then we deliver it. I’ve doing a lot of the maintenance work, but I’m looking forward to maybe off loading that to developers instead.
Jackie: How big of a effort is put on content creation with clients? I’m asking this because clients seem to have difficulty with creating content for their website, especially small to medium businesses do.
Even the larger ones seem like they just … You can’t wrangle people enough to have time to get the information that you need, how do you manage that process throughout your development?
Cathi: It does vary, again, with small jobs and big jobs. Like corporate jobs, when you’re doing jobs for corporations, it’s like how can you get like people who work at the job to all agree on what should be on the site? That’s the biggest challenge in those jobs.
One of the great things about working with, Joe, for example, is he’s SEO certified, so he can do some keyword research, and search what the competition’s doing for clients. They love that. It really motivates them to write their copy because they can wrap their head around the power of that and the competitive nature of that.
One of the greatest things last year was using HotJar. Have you used HotJar before?
Jackie: Yes, I have.
Cathi: It’s fascinating. You can record how people use websites, really useful in e-commerce. I love seeing how people are navigating around on sites and how they’re using it. When we show clients that, it also motivates them to care about what they’re putting on there.
Strange, so the competition gets them going. I know some studios are very strict. They won’t even start designing until they have copy in hand, and I can understand why it gets to that point.
Jackie: We were chatting one day about e-commerce sites and how much more work is involved in putting those together than just a traditional website for clients, and that many of us have underpriced those in the past, not realizing how much time and energy is gonna go into rolling out an e-commerce site.
Can you share your insights on-
Cathi: Oh, man. I’ve underpriced so many jobs. I’ve learned everything the very hardest way you can learn it, which I suppose is a good way ’cause you learn it, but it’s incredibly time consuming, and it also matters how much the client’s gonna be managing after you deliver the finished site and how much you’re gonna be managing.
Jackie: How ’bout educating your client on the extent of a project of this size for an e-commerce? How do you communicate to them what’s really involved in building an e-commerce site? Other than just adding a shopping cart and some items.
There’s a lot more to this.
Cathi: There’s a lot more to this. I charge them for that training time. We schedule days where we sit down and we have like sessions, either virtually on the computer, or I’ll go to their offices, or they’ll come here sometimes.
My desk is a big table. It’s a classroom setting here. When I tell them the training time, it doesn’t take long, as the training begins, for them to recognize that, “Whoa. This is a lot.”
There’s variations, and pricing, and competition, and search engine optimization, and AdWords, and retargeting ads, and social media, and all of those kinds of things are extremely time consuming.
Once you start doing Google Ads on a e-commerce site, or anything like that, you are constantly going in back in there, and like refreshing it. Just like you take care of your plants, you clean them, and you water-
All has to be nurtured, so I use the garden analogy a lot. I’m like, “You let it go to the weeds, you got weeds.” You’ve gotta keep taking care of your garden, and they all laugh at me when I say that, but it’s really true. It’s a living, breathing thing.
Jackie: Yeah, I think that’s very true for e-commerce sites, especially. Now, even just traditional websites, they still need maintenance.
If you’re trying to rank in search engines for articles you’re writing, for content you’re producing, whatever it is, the reason that you have your website for, it’s a living, breathing thing, you have to keep revisiting that all the time. You can’t just publish it and forget about it.
Cathi: It’s fluid. Things are changing, the person that they’ve been relying on to do it might not be up to date with what really should be happening with it. It’s treacherous out there, but it is a living organism in an ecosystem called the Internet.
That’s what I like about the series of atomic style sheet because it goes from atom to molecule-
Jackie: Brad Frost.
Cathi: Brad Frost. Yeah. It’s great, it’s great. That’s been really good for me to see and think about the way he’s working with clients. I’d like to know how he charges for style guides, too. I’m gonna have to ping him up and ask him about that.
Jackie: I think you should.
Cathi: I think I will.
Jackie: I think that’s a great idea.
Cathi: I will. I have a few resources to share with you, or design work. One is Rafal Tamal’s site, Typespiration. Have you used that before? Have you seen that?
Jackie: I have seen that yes.
Cathi: It’s very useful for inspiration. You can get typesetting situations, see them displayed, and he gives you the code with it, which is great. I love all his stuff, and I love all of the CSS animation on the cover of his website. Huge fan, very subtle, hover over it, and then you see a little bit more.
It’s just very royal. I always like the way he uses everything, so his stuff is good. The “A Book Apart” series … I’m in the middle of “Practical SVG” by Chris-
Jackie: I just got that one, too, and I’m reading that as well.
Cathi: It’s so great, and he’s responsible for Code Pin, right?
Jackie: Yes. Chris Coyier.
Cathi: Yeah. Yeah, right, so CodePen, if developers or designers have not used CodePen before.
Jackie: I love CodePen. It’s great.
Cathi: Take a couple days off for the week and plan to get lost over there for a while.
Jackie: Examples to see and to explore, and I love that you can just live edit it and play with it. It’s a great educational tool to understand how code works, even just some simple things that you can do. It’s awesome.
Speaking of SVG, I know you’ve mentioned that. I’ve been really interested in incorporating that a lot more into my work, and I know you have. We’ve chatted about it several times, and it seems like we’re coming to the point where it’s becoming much more mainstream.
CSS Animations and Transitions was a course that I took on Treehouse by Guil Hernandez, which I loved that one. It was very good. It really helped me understand how use it, when to use it, what are the benefits of that.
Some of the downsides of this are, and we were chatting about it is, when is too much on animation and transitions on a website? What’s your philosophy on how you’re approaching it?
Cathi: Right, right. We talked about this a lot. I agree. Those are great videos and it helped me. ‘Cause we’re in parallel universes. We’re learning some of this stuff along the same tracks. Well, I think it can be way, way, way too much. There’s something that triggers the human brain when it sees motion. It’s called “fight or flight.” Hunt or kill, that kind of thing, and I’d never want to trigger that stimuli to someone.
I don’t want to increase any sort of stress level for an end user on a website, ever. I think that the transitions in animation should be kind of under the surface a little bit. They should be a really magical reward for someone who’s beginning to actually participate in the site.
Little reward systems like on hover, or on load, something happens, very like, “Oh, let me see that again,” or “Oh, this is … This is pleasing and feeding my human reward system and it makes me want to, A, come back to the site again, B, go further in the site.”
A designer or an artist can design it to enhance the overall message mission of that particular site. If it’s a membership site or if it’s a corporate site, whatever the angle of that particular site is, it should all feed that tag, that slogan, that mission, that work. It should all be part of that same style guide and plan.
I really think that it can help with engagement. It can also help if you can collaborate with a friend and designer like yourself or someone to bring this to your site. You just don’t want to get involved with it. You’re not a designer. You can’t tell what looks visually pleasing. You can’t connect it to that business’ mission.
Well, collaborate with someone like a friend in design, or an SVG expert, or an animation expert. Someone who does that well, and you’ll be able to leverage up and get bigger jobs and better jobs ’cause you can charge for that service.
Some of my local guys can’t maybe afford that kind of styling, but you go for bigger jobs that way.
Jackie: Do you think that some subtle animations can help with accessibility as well?
Cathi: I gotta really work hard to understand accessibility better. I had the privilege of learning about accessibility in terms of color blindness when I was working with Rian (Rietveld) and Gary (Jones) on some stuff, so I understand that, and contrast ratios, and color work.
I don’t fully understand the accessibility parts that go along with animation, so that’s on my list of things to learn. I think Sara Soueidan has a lot of information on that, too. I love her site Codrops. The reference guide there, so we’ll put that in the notes, too, for everyone.
I need to learn more. I need to learn more. There’s just not about hours in the day.
Jackie: The challenge that I had like when I was doing Rethink’s logo, ’cause I wanted the gears to turn on the logo, and of course, it’s a WordPress site, so you gotta get the logo into the code, so that you can animate it.
You can’t animate it if you’re just using it as an image for an SVG, you actually have to bring it in, so I had to write a little plug-in to do that to get it to come in. Once I started working with it, I realized, okay, it’s a lot of just CSS and HTML, really. You’re just assigning classes and identifiers into your SVG elements, and then you can assign CSS transitions and transforms to them to get them to animate in there. The same way you do on a PNG file, but you can do a lot more because you can change colors in them. You can do a lot of things with an SVG that you cannot do with a PNG or anything else, or even just a basic image in there.
I do like … Maybe if you hover over an image, it just enlarges just a little bit slightly. That I have to check with Rion on, whether or not that’s a thumbs up … If that improves accessibility or not. I’m thinking it might trigger to somebody, yeah, there’s something here that’s changing here. There’s something that’s clickable here. I’ll have to follow up and find out with that, but I do like experimenting with those things.
I totally agree that you don’t want to go overboard with those things.
Cathi: Yeah, it really makes a huge difference, but you’re amazing. You’re like, “Oh, and I wrote a little plug-in to do this and do that,” and I’m like, “Why. Wait, wait, that’s not nothing.”
Jackie: Actually, that plug-in was very small. It was not a lot of lines of code at all, but it enables you to use a short code to embed the XML code into your WordPress page or post, so that if you choose to do something to do it.
Maybe you just want to change the color of it when you hover over it. Like if wanted to use SVG icons or something, and you wanted to be able to make those kind of changes where it would need to be in the HTML in order to be able to do that. That plug-in was the beginning of my work on that. I later figured, then, okay, if I’m in places where I’m not gonna be using a short code, well then I can use that code to embed it programmatically in widget areas and things like that.
That worked out really well. That was a great, fun project to do.
Cathi: Yeah, yeah, it’s awesome. It’s really great. I’m always working, breaking things down. It’s like, when I first started, I was an illustrator, so I needed a website to get my portfolio online, so that’s how I got involved with the web to begin with.
‘Cause I’m so old, we didn’t even have digital photography in college. It was analog. We did filmmaking the old way. I’ve been lucky. I’ve been able to ride the wave and I have unique perspective because I’ve experienced both ends of that, which a lot of people don’t have that opportunity. They get left behind actually.
Some of the design elements I’m gonna share with you, too. I’m gonna write in my blog post that are so basic and fundamental, I was stunned by how much of my work is removing stuff, stripping it down. Do all these mock-ups and designs. Then I’m just like, “Remove this, remove this, remove this, remove this, remove this,” so I never thought that my work would be about removing stuff and stripping things down.
I always thought being a designer, being an artist, sculptor, it was additive. I’d put this together, I’d put that together. We’d add all these resources, and that would be what this type of work is, but design work is very much the opposite.
There’s some of that, but it’s really once you have all the resources, and dissolve all the problems, design work is about removing stuff.
I want to share some design elements with you guys about position on the page, overlap, density, saturation, size, scale, color. I’m gonna do a little graphic to share, too, that will give non-designers, like a little cheat sheet.
Jackie: This is gonna be the show notes I’ve had so far. I’m really excited about this.
Cathi: Little cheat sheet for you.
Jackie: Awesome, and you’re gonna write a blog post, too, you had mentioned summarizing some of the concepts that you’ve been working on. Look forward to sharing that as well.
Cathi: Yeah, I really want to see Genesis devs doing more with SVG animation and CSS animation. I think it’s the key to taking us up to the next level, even more, because it’s obviously the best framework. Everything we do is on Genesis.
Jackie: Me too, and I saw you were in the Genesis Slack channel, and you were chatting about … I think they were talking about themes and a lot of the Genesis themes don’t have the animation and some of the more interesting designs, I guess, from that perspective. They’re certainly doable, and just taking that little extra time, if you’re gonna be changing a color or underlining something or doing something on a harbor, to just add a little bit of transition time and can make all the difference in how smooth things move along on the site.
I think a lot of us don’t take that time to add those extra things in.
Cathi: Right, and when we big jobs and projects, we need to budget for that time, and budget for that kind of thoughtful, composition work I think. That’s what I would encourage everyone to do.
Jackie: Yes, and making sure you’re supporting all the browsers and everything else. That all needs to be taken into consideration.
Cathi: Yes, all of that.
Jackie: Yes, absolutely. I wish we had more time. We’re already at the end here, Cathi. I so-
Cathi: Aw thanks.
Jackie: … enjoyed-
Cathi: I rambled on.
Jackie: No we both did, but I so enjoyed chatting with you. Thank you again for being on the show. If folks want to get in touch with you and find out more about what you do, how can they reach you?
Cathi: Sure. They can reach me at CandDStudios.com or CathiBosco.com, either one. Thank you. Thank you for shining a bright light on some of these front-end opportunities. You’re welcome. Thank you. Thank you for being on here. You’re the one that’s making it possible.
Jackie: Well, I hope you have a great week, and I’ll see you next time. Thanks.
Cathi: Thanks Jackie.
  continue reading

39 episodes

All episodes

×
 
Loading …

Welcome to Player FM!

Player FM is scanning the web for high-quality podcasts for you to enjoy right now. It's the best podcast app and works on Android, iPhone, and the web. Signup to sync subscriptions across devices.

 

Quick Reference Guide