Author Archives: Bradford Ulrich

  1. Woodshed Tea

    Leave a Comment

    I’ve watched a lot of my friends and mentors over the years start companies. But I never really had the entrepreneurial itch. I figured someday I might start a design studio of my own. But if you told me a year ago I’d have been helping to start a tea company I would have told you, “I don’t even like tea!”

    Enter Sam DuRegger. I’ve worked with Sam for almost 2 years now on the digital team at Sonic. We’re both big coffee drinkers, so we bonded over that (and a million other things and friends we have in common). Sam always made tea at work and got me to try it — and I liked it! It wasn’t sweet tea or crappy tea bags. This was fancy tea — leaves and all. It was really more like coffee in the complexity of origins and flavors.

    Well, one thing led to another, and we started a tea company together. Sam being the tea guy (and business guy) and me running the creative side of things (although I didn’t do the logo — that was the amazing Valerie Jar, one of Sam’s friends from Salt Lake City).

    I’m really proud of what we’ve made and I’m excited for you to see it (and taste it)! It’s been both incredibly hard and incredibly fun to work on my own thing. It’s like designing your own portfolio site, but people can buy it in 4oz bags. I hope you enjoy the work and thought we’ve put into it.

    Here in this enormous blog post I’ll walk through some of my favorite design details and tell you a little about how we launched and what we learned.

    To be clear, this is definitely a nights and weekends project — neither of us are leaving our work at Sonic. But we’re excited to have a small, fun, inspiring project to work on outside of our 9–5.

    Edit Jan 1, 2019: At the end of 2018 I amicably sold my stake in the company to one of the other partners. It was super fun and I love those guys and the shop, but the amount of free time I have to dedicate to the project as we added our 2nd child, is not the same as it was when we started, if you can imagine.

    The Tea

    I had no idea tea was so complex. So many varieties of tea come from the leaves of one simple plant. When we talked about how to photograph the tea, we wanted the tea itself to be the focus. When you use a tea bag, you don’t get to see the tea (which is probably good, because most tea bags are just lower-quality tea leaves or powder, much like instant coffee). But when you brew loose leaf tea, you see the tea leaves expand and the color of the tea be extracted into the water. It’s such an interesting, mesmerizing process. So we photographed the teas just as you’d see them when you brew it.

    When photographing the piles of tea, the shadows were incredibly hard to cut out at first. But if you place the tea leaves (or any other small, detailed object like jewelry) on a glass surface 1–2 feet above your solid background, the shadows are diffused away. Warning: if you leave 10 piles of loose leaf tea out on a glass coffee table, your wife will think you’re doing drugs when she gets home.

    teas

    Product Pages

    On the individual product pages, we took over the page with each tea’s brewed color. We used this color theme throughout the site. When you hover on the teas on the homepage, a small dot showing the tea’s color appears. And the active state of each tea type is highlighted with the general color of that tea type. When you make coffee, the color is pretty much the color of coffee. But each tea has a unique shade and even changes depending on how strong you make it. So we wanted to make sure color played a big role in the product pages to differentiate the teas and bring more context into the experience.

    gingermint-page
    nilgiri-page
    oolong-page

    Filtering

    All tea comes from tea leaves. But the way those leaves are grown, picked, dried, stored and flavored can drastically affect the taste. I got a crash course in tea history from this book at the library, and the history and varieties are fascinating. But for most people, tea is tea. We wanted to approach tea with a high standard for quality and sustainability, but we also wanted to make tea accessible to learn about for newcomers (like myself). We have the standard filtering by tea type: black, green, oolong, white, and herbal, but we also give you the option to filter by flavor, so you can filter our teas based on your preferred taste. I built this filtering system using Isotope. I’ve used it on so many projects now. Super simple, fast filtering with subtle, smooth animations. It’s a little finicky to do responsively, but it works. When I build this site into a CMS I’ll add tags for each filtering option and output those on the tea elements.

    teasort

    tea-filter

    So whether you’re a Sam (tea connoisseur) or a Brad (tea novice), you can find a tea that sounds and tastes good to you.

    Brewing Equipment

    Another thing we realized when talking with people new to tea, is the brewing process is mysterious. They’re used to tea bags or ordering tea at a shop. But they don’t have the tools at home to make it. So we sell a simple minimal brew pot from Vivid. We’re planning to offer more tea equipment in the future as well. But for now, the Vivid brew pot is our favorite and the easiest way to get started brewing loose leaf tea.

    The brew pot is a simple way to make tea. Instead of using a ceramic or steel pot with a tea bag, you get to watch the leaves expand and the color of the tea saturate through the glass. Loose leaf brewing also gives you a more balanced, full flavor than tea bags. Also with most of our teas, you can steep them multiple times, yielding different flavors each time.

    tea-gif3

    I made a few of these tea pouring GIFs from the photos Caitlin took to illustrate the way the tea changes as it expands and as the color develops. We did a few time lapses for Instagram as well. It’s hard to capture what each tea looks like in a single product photo, as it changes so much throughout the brewing process, so these brew and pour GIFs are perfect for showing off the product and the process.

    Packaging

    bag-jpThe packaging system uses simple wraparound stickers on craft bags. The oz indicator is a stamp, so we can order all the labels for each tea at once and use the same label for 2oz bags or 16oz wholesale bags.

    We’ve found some bags that are compostable, and are continuing to find ways to be environmentally responsible with our packaging. We’re also exploring other packaging form factors for upcoming limited edition teas.

    Valerie also did the initial label design, but we’ve made some tweaks to simplify it a little bit. It was my first print project beyond business cards in a while. It was cool to go see the printing press where we got them printed in OKC and meet the guys printing our labels. They explained how I apparently picked an incredibly hard black color to reproduce consistently, but they were able to do it. And it was perfect. There is a tiny bit of red in it if you look closely, but it’s not overtly brown.

    Brewguide

    My personal favorite part of this project was building the Brewguide. I found myself making tea every morning and night, but still checking the bag label for Sam’s handwritten instructions (time, temp, tsp/tbps?). I was also using my iPhone timer, which gets the job done, but felt like overkill. So I built my own timer that felt more like watching tea slowly change color than running laps.

    brewguide

    The Brewguide is a web app (for now) that lets you select your tea, gives instructions on how to prepare it, and gives you a simple timer that fills the screen as your tea brews. It’s part of our website, but you can add it to your phone’s homescreen for a shortcut to get the full screen effect.

    Even though I know most of the times and temperatures now for my favorite teas, the Brewguide has become part of my ritual of making tea.

    I used timed CSS animations to create the timer fill. Right now, if your screen goes to sleep, it will pause the timer. So I’m looking into building it into a webview-driven iPhone app, so I can turn off auto-sleep for the app (which you can’t do in a web app). I love using it and it feels so much calmer than the iPhone stopwatch or alarm. Eventually I’ll probably use the individual tea color values for the fill color instead of the brand blue.

    brewguide

    Store

    I thought about combining the Brewguide and the product pages at first, but I realized that while they shared some of the same details, they were for totally different audiences. The whole point of the Brewguide was to be a streamlined timer with simple brewing instructions (it was all text-based for the first couple weeks I used it). So we decided to keep them separate, which meant we needed a store. Before I built this site, we had used Shopify and Square for our online store. While they were both cool in their own way, and got us something to send friends, family and early wholesale clients to place orders, I knew it would take way longer to integrate the site into a CMS and store. So we launched with just static HTML site and Shopify’s embeded products. It’s such a cool feature. We built the store in Shopify and can embed a buy button anywhere on our site, similar to Stripe Checkout. It even maintains a customizable floating cart icon across the site.

    So we’ll definitely come back to it and build a custom store CMS. But for now, this got it out the door and kept our design the way we wanted it without compromising to a template. And Shopify handles all the customer and shipping info in a popup so it’s fully secure without us needing to own it yet.

    What’s Next

    Like with any project, there are things I’d do differently and things I can’t wait to fix. One of those is the image weight of the site. Right now each tea photo weighs in at around 450kb as a transparent png. If I save them as progressive jpgs, they go down to 150kb. Which sucks. I only need the transparency on desktop, where we have the fixed woodgrain background. On mobile the fixed background doesn’t apply, so I don’t need pngs. So I’m planning to implement srcset to load the flat jpgs on mobile devices and the transparent pngs on desktop devices. Making images 3x smaller for mobile users is a huge savings. I’ve never used srcset for images before and I’m not even sure yet if I can change image formats or not. I’m looking at a couple other alternatives like simply using media queries. But I want to explore a few options and learn the best way to do it.

    Also on my hit list is the dreaded CMS. I’ll probably build it on WordPress, as it is my long-loved platform of choice. I’ve looked at other platforms like Prismic.io or a custom Shopify or Squarespace template. But every time I compare, WordPress comes out as the easiest to customize and extend. It’s not without its problems, but if I’m the one building it all, I want to make sure I’m able to maintain it myself.

    Also on our list is creating a series of videos about tea, equipment, preparation, history, cocktails and more! We’ve got a short list in mind, but need to plan them all out more.

    So there is much more to come for Woodshed. We went through our plans for the upcoming months last week and I can’t wait to get started on them. It’s more product-related stuff like future tea offerings, packaging and partnerships, not just website features. But I’ve got a few of those planned soon too.

    I hope you enjoyed this looooong look into my process. If you have any questions or ideas, I’d love to hear them. Or if you find any bugs on the site, I’d love to fix them, so let me know.

    Follow me @adbrad and follow @woodshedtea on Twitter and Instagram for updates. And go buy some tea on the site! It’s great tea, I promise.

    By the way, Clarity Coffee in OKC is going to be serving Matcha Lattes made with our Matcha Mix on Thursday (St. Patrick’s Day!). Go by and try one! They’re so good. I’m biased, but it’s true.

    A video posted by Clarity Coffee (@claritycoffee) on

  2. Notes from UX Advantage

    Leave a Comment

    I had the opportunity to attend UX Advantage (put on by Jared Spool of UIE) last year, and I forgot to write about what I learned. This is what I wrote down. I’ll write more soon on what I learned and how it has affected my work the past few months.

    This is just rapid-fire notes transcribed from my notebook at the conference. It was super helpful and enlightening to see other teams at other large corporations having the same struggles we are. I apologize for the frantic sound-bite nature of these notes.

    Main takeaways:

    “Soak the team in customer feedback.”

    “Always be getting reality from customers.”

    Results and problem-solving is easier to sell than the visuals of design for design’s own good, or for the pretty factor.

    “Colocation is hugely important, so a team feels like a team.”

    “Schedule is king -> Customer is king”

    Get legal in the room at the start, not tack it on at the end. Make them understand the project, not just put a boilerplate at the end.

    Find out “Who is saying no and why are they saying no?” Don’t let empty “no’s” stop you from making something you know is better.

    ​”Understanding the users is catnip for executive teams.”

    Anyone who has product influence should spend 2 hours with users every 6 weeks.

    Product roadmap should be problems you will solve, not features you will build.

    People have empathy, but there is no structure in our culture for empathy. Need to engage ourselves with users.

     

    Bill Scott, PayPal

    Create a shared understanding between design, engineering and marketing.

    Have the humility to improvise.

    Get legal in the design process early and explain the problem. Get them involved in the solution, not just tacking on the disclaimer.

    “Soak the team in customer feedback.”

    Note certain people that you can’t change and work around them.

    “The UI layer is the experimentation layer.”

    “Change from a culture of delivery to a culture of learning.”

    Create tweetable moments when talking with executives. You don’t get much time, so make your conversation and points memorable.

    They will start to repeat them and you want them repeating the right things until they start to believe them.

    RITE usability testing (1-2 week sprints): MTW – Build, Th – Test, Fri – Report, feedback, decisions

    Old system was 3 months -> usability test

    New system was 1 week live coded testing

    12-week sprint of tests

    “If you make other people successful instead of policing them, they’ll come to you for advice, not avoid you.”

    “Always be getting reality from customers.”

    “We really sucked. Here’s how we got better.” (re: PayPal over time)

    Nuisance distance architecture

     

    Steve Turbek, Fidelity: Design-driven UX Team

    Results and problem-solving is easier to sell than the visuals of design for design’s own good, or for the pretty factor.

    Getting developers involved in a project before it’s an official project can be transformative.

    “Funny thing is silos are meant to protect the corn from birds.” – balance of silo vs. full collaboration & productivity

    Device lab is in a prominent place in the space – establishes the importance of the mobile shift. Investment in tools to properly test for all contexts. Put it in front of yourself as a reminder to build for real context.

    A modern office send a message to existing and new/future employees that you have a cultural understanding of design.

    The creative director role for low-level designer development, as more and more moves to code – deliverables are fuzzy.

    They created the track of Senior Individual Contributor, instead of a forced management role to move up. SIC’s roles spread and their influence on projects can be more broad. Long-term effect of faster/cheaper projects.

    Senior IC’s spend time mentoring and diving deep into their expertise.

    Distinction between innovation space and design space – innovation encourages more collaboration and invitation.

    When an agency isn’t involved in how things are built, it’s hard for them to do something that can be built/integrated.

    Usability testing shouldn’t be done by the people designing the experience – too much bias in designing the test and the conversation with the user.

     

    Scott Zimmer, David Baker: The Role of Outsiders

    ​If you hire the brains, let them do the work. If not, the in-house team will be uninspired to build it. (#loyalty)

    “The only thing that terrifies firms more than a conflict of interest is incompetence.”

    “Colocation is hugely important, so a team feels like a team.”

     

    Samantha Soma, Bringing UX to All of GE

    They inserted their team into the hiring process, after learning that friends got form letters from their recruiters. Took over the process to get the team they wanted.

     

    Mark Rettig, Organizational Becoming

    Observe. Reflect. Make.
    Open attention & dialogue.
    Quality of attention -> quality of result.

    Design Capacity is not Design Culture.
    (an innovation lab does not by existing create an innovation culture)

    “Cynicism is a product of repeated disappointment.”

    “To remove cynicism, move outside of yourself.”

    We all care about quality.

    “Schedule is king -> Customer is king”

    “Research brought back orange.
    Management sees orange.
    ‘Hang on, we only do blue. Take what you learned from orange and use it make better blue!'”

    Ask “Who do we need to become to do orange?”

     

    Yes Lawyer

    Get legal in the room at the start, not tack it on at the end. Make them understand the project, not just put a boilerplate at the end.

    Understand the actual rules and the spirit of them, so you can push back when you understand it.

    You shouldn’t be given solutions to build. You should get problems to solve.

    Find out “Who is saying no and why are they saying no?” Don’t let empty “no’s” stop you from making something you know is better.

    Have empathy for legal and they will have it for you.

     

    Christ Avore, NASDAQ

    A deliverable is something you pass off as a spec; An artifact is something you just throw out there for consideration.

    “The prototypes aren’t optional.” re: devs not building what you intend

    New title being used, UX Prototyper

    ​”Understanding the users is catnip for executive teams.”

     

    Adam Cutler, IBM

    ​”Empathy, not ego”
    1,200 designers by 2016 at IBM, 10k applications

    Onboarding at IBM for new hires is 6-12 week process – boot camps

    Design is the expression of intent. ​So anyone can design.

    “You’ve sucked for so long and now design is here to save the day.” is not the way to win hearts & minds.

    Senior Executives are invited to design reviews. Quick run-through of all visible work, even sketched in the project.

    Moveable, transportable whiteboards. On hooks to transport around to different rooms/walls.

     

    Jared Spool

    Stages of becoming design-infused:
    – Dark ages
    – Spot UX projects
    – UX Effort
    – Embedded teams
    – Design-infused culture

    Customer satisfaction surveys are not the best way to learn.
    Anyone who has product influence should spend 2 hours with users every 6 weeks.

    UX should be where the decisions get made. IT if IT-led. Marketing if marketing-led, etc.

    The UX Tipping Point in a design-infused culture is when more than half the projects ship when the design is ready and not before.

    Successful Design-led companies have these in common:
    1. Exposure to users
    – 2 hours with users every 6 weeks
    – “I think” turns into “we saw someone…”
    2. Vision of the experience
    – what will the whole experience look like (regardless of technology) look like in 5 years
    3. Culture of continual learning

    Product roadmap list problems, not features
    – problems you will solve, not features you will build
    – stories of those problems come from users

    People have empathy, but there is no structure in our culture for empathy. Need to engage ourselves with users.

    We have to design how we make UX a competitive advantage.

  3. New Ad Format on TNW

    Leave a Comment

    The Next Web redesigned their site recently and introduced a new full-page intro ad format.

    This is actually quite a beautiful animation and design on the ad itself, but this model feels like the content is the new annoying banner ad, bouncing on the edge of the screen.

    I actually clicked on the first ad I saw this way for Evernote, but not because it was especially engaging, but because I didn’t know how to get to the content. The call to action was “get started” so I thought that would let me read the article. But it sent me to Evernote’s homepage instead. So I guess it works!

    I’m interested to see how this does, but my first thoughts are this is really overwhelming. I’d rather not have to chase down the content I came there for. But at least it’s better than the evasive close button on a moving banner ad…I think.

  4. Blog Posts About Google’s Material Design

    Leave a Comment

    I’m really interested in Google’s new Material Design concept. Makes me want to try an Android phone when my upgrade comes along. Especially after all of Jesse‘s HTC cheering (and design work).

    I’ve read a couple interesting posts from design heroes of mine on the subject that you should check out. I’ll add more on the subject here as I come across it.

    Elliot Jay Stocks

    http://www.elliotjaystocks.com/blog/googles-material-design/

    Khoi Vinh

    http://www.subtraction.com/2014/06/26/googles-material-design/

  5. First (Certainly Not Last) Experience Creating Custom Icon Fonts

    Leave a Comment

    I try to use the most flexible formats as I can in my work. That means spending a little more time up-front creating assets that are scalable and editable, so I don’t need to recreate the wheel every time a size changes or we need a hover state for something. Sometimes that means extra CSS. Sometimes it’s using an SVG instead of a rasterized image. And sometimes it means using icon fonts instead of image icons.

    WordPress 3.8 made some huge updates to the dashboard interface design. At first I was very skeptical of the changes, but by now I’ve grown to really like them. They’ve polished things up quite a bit. One of the things that has come a long way is the icon system WordPress uses. It’s not perfect, but it’s really improved and expanded recently from some of the initial icons that were proposed.

    With WordPress moving from image icons in the sidebar menu (and other places in the dashboard like the MCE editor), we’ve had to adapt our plugin icons as well. Our plugin icons were all pretty polished as images, and it was a real challenge to adapt them to 1-color while still retaining their personality. A lot of non-designers said this was a good change because everyone could just use the default set of new icons for all their post types. While this is great for people building simple plugins with no branding, we lose some serious branding in the dashboards of our customers if we start using the standard WordPress icons that any other plugins can use. So I designed some custom icons for our most popular plugins. I created a lot of versions of these at various weights to get the point of the icon across without losing all the personality of each logo, and without losing the clarity of the icon at 32px.

    Here’s what I’ve done for BackupBuddy, Exchange and iThemes Security so far. I also did one for Builder, but I’m still working out some kinks on that one. It might not look like much, but a lot of effort (maybe a little too much) went into making these stand out and still manage to communicate our brand effectively.

    I used the awesome icomoon.io to generate the icon font from SVGs. I’d like to eventually get some basic font creation software for using icon fonts more. But for this first use, icomoon.io was perfect. We use a single font for all our icons that we load as a git submodule in each of our plugins to keep them up to date and to not have to load 4 fonts if you run 4 of our plugins or themes at once (which many of our customers do).

     

    wp-icon-font

    It’s not the simplest solution, but it’s a really flexible one, since you can do a lot more with an icon font than an image. You can use CSS properties to style it just like text, so you can add text-shadows, change colors and use transitions easily. And all with less load than an image, especially if you use a lot of icons in a system. I’ve only used Symbolset as an actual icon font on the front-end of a site and I’ve liked it a lot. But I haven’t created any custom icon font sets yet for use on the front end of a project.

    I learned recently that you can use any Dashicons as your custom post type icon by referencing it instead of an image file in your post type code.

    This is the code that registers my portfolio post type “Work”. The menu_icon line shows I’m using the 'dashicons-images-alt2' icon for my projects. Super simple to implement for things that don’t need the level of branding consideration as our products at iThemes.

    The line you need to look at:
    'menu_icon' => 'dashicons-images-alt2'

    The code that registers my Work post type.

    function work_post_type() {
    register_post_type( 'work',
    array(
    'labels' => array(
    'name' => __( 'Work' ),
    'singular_name' => __( 'Work' ),
    'add_new_item' => __( 'Add new Work' ),
    'edit_item' => __( 'Edit Work' ),
    'new_item' => __( 'New Work' ),
    'all_items' => __( 'All Work' ),
    'view_item' => __( 'View Work' ),
    'search_items' => __( 'Search Work' ),
    'view_item' => __( 'View Work' ),
    'menu_name' => __( 'Work' ),
    ),
    'has_archive' => true,
    'hierarchical' => true,
    'public' => true,
    'menu_position' => 6,
    'rewrite' => array( 'slug' => 'work' ),
    'menu_icon' => 'dashicons-images-alt2',
    'supports' => array( 'title', 'thumbnail', 'editor', 'excerpt' ),
    )
    );
    }

  6. Frank Chimero’s New Website and Owning Your Content

    Leave a Comment

    Before reading, go check out frankchimero.com. I won’t feel bad if you don’t come back.

    It doesn’t have his portfolio there yet. But it has so much else to explore that explains his process and influences.

    It’s got a few elements I’ve toyed with on this site, like links and quotes. But I love the idea of the library, the music stream and the clips photo feed.

    But all of those details aside, I love the idea of him building a place for himself. Frank referred to it as Internet Homesteading a few months ago when he mentioned working on a new website.

    I keep the links and quotes feeds on this site, not for other people to come and click the links or be inspired by the quotes, but more as an archive for myself of things I want to remember and store somewhere for myself to reference later.

    I have a Pinterest, a tumblr, a Twitter, a Facebook, an Instapaper, and countless other places to store the things I find online. But all of those are controlled and designed by other people. And anything I put in one of those places is not guaranteed to stay there or stay mine. If 90% of their users want to change the way something works, I have no say.

    I want to create a place where I can chronicle the things I find useful or inspirational, organize them however I want, add whatever details I want and design their output however I want.

    After seeing Frank’s take on the concept, it makes me really want to go back and work on this more. I’ve created simple custom post types to house each section – work projects, reading/links and quotes. I’d like to revisit these with more of a plan behind them. When I first created them, it was really an experiment to learn how to build custom post types with custom fields. They were cobbled together from the beginning, and I’m surprised they’ve worked for this long.

    So I’m going to rebuild those sections a little bit and make a solid foundation to safely contain those things I need to remember. And I might add a couple more rooms to keep more things I want to catalog on here, like music or food.

    So here’s to owning your content online (internet hoarding) and filling up your house with things you love.

  7. Oklahoma Rock

    Leave a Comment

    OklahomaRock.com just got a major upgrade thanks to Ty of iThemes Creative Services. Ty did all the site design and development, and I helped out with a new logo. I’ve kept up with OklahomaRock.com for a long time on their old site. So it’s awesome to see their new site with a lot of awesome new functionality built on our WordPress theme, Builder. And Ty did a great job of integrating the logo into the site.

    It’s kind of an abstract buffalo skull/record/locomotive. Didn’t want to just do another Oklahoma flag drawing or an obvious buffalo thing, so making it more of a rough shape with a couple possible ambiguous interpretations was fun. I was really excited to get to work on something like this for Ryan.

     

     

    okrock-logo1

     

     

     

    okrock-logo2

     

     

     

    okrock-logo3

     

  8. The Redesign of iThemes.com

    Leave a Comment

    I’ve worked for iThemes since January 2010. Since I started working here, I’ve been making updates to our site – designing sidebar ads, new sales pages, adding custom post types for our content and products, and making little tweaks everywhere. But after 2 years of piling more and more into the old theme, we knew we had to bite the bullet and do a full site overhaul and redesign.

    So a few months ago, Cory gave the green light for Ty and I to start working on what a redesigned iThemes would look like. After loads of revisions and decisions we started on the development in June, and since then, I’ve been Photoshopping every possible page layout and product sales page for the site and slowly passing them over to Ty for front-end development.

    This was my first design with responsiveness in mind from the start, so it was definitely a challenge. Interactions that you take for granted on desktop have to take on a whole new strategy for mobile – no more wide info-packed tables, no relying on image sizes or fixed font proportions. Every design decision has to pass through the “how will this work on a phone?” test. So I’m glad Ty was doing the dev on this one. He’s a lightning-fast coder and has done stuff on the site I would never have thought possible. It was fun to get to stretch the design beyond my own coding capabilities, and imagine what I would want, not what I think I could build.

    So go check out the site! We’re still making a lot of responsive adjustments, so if you’re on a phone or tablet, bear with us a couple days. But we hope this makes it easier and more pleasant for customers to use the site and understand our products better at iThemes.

    Thanks to Ty and Koop for the theme development. Thanks to Cory for trusting me to work on this enormous project. And thanks to the rest of the iThemes team for helping make the switch yesterday in the wee hours and building the awesome products that we used to build the site and that this new design will help sell.

    The new iThemes.com homepage

    New iThemes.com footer

    New plugin sales pages with all content created using the new Products custom post type.

  9. Our Wedding

    1 Comment

    Around 9pm on June 30, 2012 I married Sherree Jane Chamberlain on the rooftop of the Oklahoma City Museum of Art.

    We led everyone to believe that we had been married earlier that night in a private ceremony before the reception. After we had some time to say hi to friends and family at the reception and after our dads, maid of honor and best man gave toasts, we surprised everyone and had the ceremony right there on the roof. We read the vows we had written for each other, exchanged rings and danced the rest of the night with our family and friends. I couldn’t have imagined a better celebration. And I’m so thankful to all of our friends and family who helped us put it all together and helped us party on the roof that night. It was a beautiful night worthy of my beautiful bride.

    Here are just a few of the photos that Josh McCullock took for us that day. He was awesome.

    Suit and tie from J.Crew. My dad’s gold cufflinks. Belt from Tanner Goods.

    First look at the Colcord Hotel in Oklahoma City.

    Sherree made all of the decorations for the wedding. She had never seen everything together until Lindsay and Holly from Gibson Events set it all up the day of. And it looked even better than we could have imagined.

    Derek and Travis from Warpaint Clothing helped me to screen print this poster the day before the wedding. Go buy stuff in their store. They’re awesome guys and I can’t thank them enough for helping us get it done last minute.

    I designed the poster as our guestbook, having everyone sign as witnesses to the wedding. The illustration is a representation of the Museum of Art rooftop and glass tower entrance.

    My groomsmen: Poppe, Podge, Spmag, Kevin and Biddy.

    Sherree’s nephew Ben.

    Ben breakdancing in those white suede Bucs.

    Our beautiful city.

    [Update]: Two of my groomsmen are unfortunately two of the best videographers in OKC. They filmed my sister’s wedding and countless other friends weddings. But I wanted them to be a part of the ceremony. So we got a few other guys to film our wedding and has Travis to edit it. He did an amazing job. And here it is.

  10. I’m Getting Married This Weekend

    Leave a Comment

    Remember that Sherree Chamberlain girl I’ve blogged about here, here and here?

    Well I’m going to marry her on Saturday. I’m pretty excited about it. But I’m also pretty busy writing letters, wrapping things, printing things, and general wedding prep madness right now, so you’ll have to check out the wedding site I made for details.

  11. Go Far Together

    Leave a Comment

    My boss always quotes an ancient Chinese proverb:

    If you want to go fast, go alone.
    If you want to go far, go together.

    It’s been one of our core values at iThemes. We all do greater work together than any of us could do alone.

    Update: We made this our customer focus for 2014. Check out the full page with the updated design ithemes.com/go-far-together

    So because of this motto, he wanted me to make a poster for our office that said “Go far together.” When we had some new offices put it at iThemes (by new offices, we mean new walls that make offices out of the old warehouse space we’re in), we created a new long empty wall. We decided it could be much cooler to paint this idea 7 feet tall on the wall, instead of just printing a poster. So Kristen, Elise and I got to work painting last week, and we think it looks pretty awesome.

    Kristen and her husband helped put together this time lapse of us painting it.

    Here’s a clearer version of the design. I was particularly excited about the modified arrow forms along the bottom of “far.”

    Although after seeing this article, maybe I should have asked Cory for stock, instead of salary: http://dcurt.is/artist-will-make-200-million-in-facebook-ipo

  12. A Blackwatch Christmas

    Leave a Comment

    Here’s another video from Nathan Poppe about local music made in Norman. I’ve been watching this video take shape every couple days when Nathan would show me what he changed, and I’m so excited that it’s finally out in the wild. Check out the video, and get the whole Fowler VW/Blackwatch Christmas album for free here.

  13. The Frontier Is Everywhere

    Leave a Comment

    One of the most beautiful and encouraging videos I’ve ever seen. I come back to it often. Narrated by Carl Sagan.

    Watch it full screen. In HD. In the dark.

  14. Sherree Chamberlain’s New Album

    1 Comment

    Sherree Chamberlain is about to start on her second album!

    So if you’re not yet familiar with Sherree’s music, go to ye old iTunes and check out her first album. But even more importantly, go to Kickstarter and help her make (and get your own copy of) her next album. I personally bloguarantee that you will love it.

    Go support Sherree’s album now. →

    Disclaimer: My roommate made this video. That’s my fireplace.
    Also, I am madly in love with this woman.

  15. The Golden Age by Beck

    Leave a Comment [audio:http://bradulrich.com/wp-content/uploads/2011/09/01-The-Golden-Age1.mp3|titles=The Golden Age]

    This song can make any stressed out week calm down. The Golden Age by Beck has been calming me down since sophomore year of college working at the newspaper.

  16. Home Office

    Leave a Comment

    Finally got around to putting up some a couple prints and letters in my home office. Desk and chair from IKEA. Chalkboard is from a garage sale and is 90 years old. Letters are from an antique dealer in OKC. I also have an L, but you can’t see it in this picture. Sorry the photo is so crappy. Still getting used to the 360 panorama app.