Customizing and Integrating WordPress Blogs

09.06.2013

When we started designing LunarLincoln’s website we knew that we wanted to include a blog. I set out to find a blogging platform that would suit our needs; when I saw our hosting provider offered one-click WordPress installs, I was sold. I setup a subdomain to host the blog and had it up and running in no time. I wanted to fully integrate the blog into the website, so I did a quick Google search and found that I could pull content from WordPress using “The Loop“. Awesome, now I had a backend to handle managing the blog (it wasn’t properly themed, but we would be the only ones seeing it) and a beautifully themed front end for our visitors. I felt pretty good about this. I had successfully integrated WordPress into my website! Or had I? As we added blog posts, I kept having to add CSS rules to my for each new content type. Submitted a post with an image? Just a sec, let me put reasonable padding around that. Need to see more than 5 blog posts at a time on our website? Let me write a custom pager. Luckily the inherent laziness that has fueled so much of my engineering career kicked in and I decided there had to be a better way. I did another Google Search, digging a little deeper this time. It was amazing what I found in 15 minutes.

On most platforms, there’s the “right way” to do things and then there’s the “wrong way”. And I had inadvertently chosen the wrong way. An article from PressCoders set me straight (see Section 2: Rookie Mistakes). Turns out I didn’t have to hack WordPress to bend it to my whims, all I had to do was follow WordPress’s documentation to theme our blog correctly. Creating a custom theme in WordPress is fairly straightforward. First, find a theme that you like. Then create a child theme and override what you want to change. In our case a custom header and footer file combined with a bit of CSS did the trick. Once the theme was coded I rescued our stranded WordPress instance and moved it into a folder at our main domain. The finished product is what’s hosting this very blog post.

I’ve used this technique to help create a few other blogs as well. My good friend Chris Paz needed a video blog for his upcoming travel adventures. He uses certain design elements in his videos and wanted a blog theme to match. With his artwork I was able to set up a themed instance for him in under a day. Even Jennifer is getting into custom WordPress instances, employing no less than 2 on her newly redesigned portfolio page. What is perhaps most impressive about WordPress as a platform is that we’re all hosting different types of content. This blog is mainly for text, while Chris’s focuses on video and Jennifer’s includes works from her portfolio. It all looks great and is easy to manage, which lets us focus on creating content.

WordPress and I didn’t get along well at first and this project was a friendly reminder that I should research “the right way” to do things when I start working on a new platform. But all in I have to say I’m mighty impressed with WordPress at the moment. It feels good to ship, and I’ve gotten to help ship 3 of these blogs in the past month. Now I just need to write more blog posts…

Do your homework

08.19.2013

In the beginning stage of building an app and even in the later stages – its always important to “do your homework”. What is your homework exactly? Checking out the scene, the market, other peoples work.

Really “your homework” is actually asking to see a copy of your friend’s homework right before first period because you weren’t sure how to do yours, or maybe you were too lazy to do the initial parts or maybe they just had better answers. Or…maybe that analogy got off the tracks there.

homework

A little story to explain clearer. Wiley loves Kerbal. A. Lot. If Wiley could actually be in space like the Kerbal’s he would. But for now he has to settle for entire Sunday’s of stranding Kerbal’s in orbit around Mun INSTEAD OF FINISHING UP LUNCHTIMER *ahem*. Shipping dude, shipping.

A while back we got into a discussion about a simpler form of Kerbal. A physics game with planets and exploration and lots of nerdy easter eggs. We got excited. Really excited. We started planning our rocketship game. We drew pictures and argued about rewards systems. We named our levels/planets – Tyson, Sagan, Hadfield.

Then we looked in the app store to see what was out there already – surely nothing as awesome as what we were planning. But…Angry Birds Space had launched the day before….we had just spent two hours subconciously recreating all of Angry Birds Space. That was some crappy homework discovery.

But it was important. Sometimes homework doesn’t kill your app, but makes it stronger – gives you a broader view. You’re building a to-do app? What about to-do’s for kids? for elderly people? to-do for a specific industry? for everyone? for super anal people (who are honestly the only ones who actually use to-do apps beyond the first few weeks)?

Sometimes you’ll discover that people have already built your app…but…they didn’t do it as well, or with this feature, or with nice colors, or they didn’t bother to build it for Android. (Android needs love too)!

Love the “description” for this one in the google play store:

Screen shot 2013-08-19 at 10.00.04 PM

Now don’t straight up “copy your homework” like the above. But get to googling, dribbbling, smashing, and browsing.

Get inspired. Get informed.

Poly Poly Poly

08.15.2013

So, I have been seeing this style of design for awhile now and have really loved it. It was one of those things where I couldn’t find the right “google-magic” to really know what it was called. “Triangle+abstract+shattered+folded paper+art+design” was just not cutting it.

Luckily, one of my many random “sign up for this stupid newsletter to get this free download” e-blasts was actually useful this week. (And yes, I do read ALL of my e-mail, ALL of the time) It’s called….

LOW POLY. Now. What does low poly look like? Like these excellent examples:

low-poly-timothy-reynolds-1b
lowpolysphere
low-poly-JR-Schmidt-3

It seems that the programs you use to create these beauties lies more in the realm of video editing. But with the help of this refreshingly, wonderful tutorial (it actually includes all steps, clear, quick commentary, and nice/realistic examples), I am going to make myself a ton of these awesome pointy and colorful things. New art to come!

Cocoa Controls is my one stop shop for open-sourced iOS and Mac UI components

07.16.2013

“Don’t reinvent the wheel”. That’s probably one of the most important rules I follow as a developer. I save time by leveraging the hard work of other generous developers and using their open-sourced code in my apps. Simple Google searches will turn up code that can help your app do everything from simplifying network operations to leveraging GPUs for enhanced image processing.

Screen shot 2013-07-16 at 6.56.03 PMCocoa Controls is like a Google search on crack for custom iOS and Mac UI components. At the time of this writing there are 1,369 components listed on their site. They make it easy to search for components that are licensed appropriately and provide screenshots of the controls so you can see what they look like without having to download and run the code. In working on LunchTimer, I found I needed a UISlider with 2 handles to input the lunch window. So I browsed over to Cocoa Controls, did a quick search, and before long I had NMRangeSlider up and running. Here’s what it looked like after I customized it:

HOTTTTTT

Perhaps my favorite part of Cocoa Controls is their Apps section, which lists apps using controls from Cocoa Controls. It feels good when you’re in the company of Evernote, Facebook, and Vine, just to name a few.

Power users looking to manage their favorite Cocoa Controls components may also want to check out CocoaPods. CocoaPods is a dependency management tool for iOS and Mac that makes it dead easy to include custom controls in your app. Cocoa Controls conveniently includes the pod declaration for each supported component, making the process of using custom controls in your app even easier.

Necessity is the Mother of Invention

07.12.2013

Ninety percent of LunarLincoln’s app ideas come while walking to get coffee. These idea’s usually come about like this:  “I was so annoyed today when” and then usually end with “wouldn’t it be great if…” Working through problems. Making life easier. Or maybe not easier, but better, happier, certainly more convenient through apps is something we want to do, and CAN do here at LunarLincoln.

The list of app ideas is long, the market is fast, and let’s be real, some ideas are better, much better, than others. Luckily we have the tools, brains, and skills to make some of these into a reality. Our first foray into the world under our own banner is a little app called LunchTimer.

The app’s clothes are done, the guts are being built, and even now, I find myself wishing that it was done, merely to help my own scatter-brained self along. How, you ask?

I find myself running errands, lots of errands during lunch. Or grabbing food with friends, or sitting in interminably long business lunches, and in each of these situations, I don’t have the time, or forget, or it’s rude to continually check my phone to see if it’s time to head back to the office. Is lunchtime over yet?

Is it now?

Now?

Now?

How about now?

After looking at my phone 15 times in the last 20 minutes of lunch, only to see the time inching by and then later whizzing, LunchTimer was created.

The short and sweet: LunchTimer automatically knows when you leave work (with low-enegy gps tracking), and then begins the clock for the length of your lunchhour. It notifies you at a preset time (5 minutes/10 minutes) when its almost time to head back.

Voilà. No more being late getting back, no more sitting your phone on the table rudely, no more constant wrist checking. I hope you guys think this is a good of an idea as I do, and if not. Well, I’m still going to use the shit out of this app.

 

Font-tastic

07.05.2013

Similar to colors, font’s can make or break your design. It’s often the things that are the most subtle, that make the most impact.

Font selection, kerning, line height, style, these are all things you definitely should be thinking about. With the wonderful invention of FontFace, you no longer are limited to the standard web fonts.

Comic sans the whole site! Or don’t. Please don’t.

Or use this wonderful resource of “new” webfonts. Or convert one of your favorite fonts to a “webfont” with FontSquirrel (a font aggregator with great taste).

Now, I recognize I have a serious problem with fonts – similar to Pokemon, I feel, I’ve “gotta collect them all”. 52 body styles of Neutra? Bring it on! 100 different “handwriting fonts”? Why not? Fonts based purely on dingbats? Sh’yeah.

At the end of the day, though, less is more.
Build your app or website with no more than 3 fonts:

  • A display font (the fun/elaborate one for titles & big things)
  • A body font (basic serif or sans serif)
  • And maybe a third one for variation – pull quotes, sidebars, submenus, etc (another simple complementary serif/sans to pair with the body).

After selecting the “look” of your fonts, then you can get down the nitty-gritty – the “science of fonts” if you will. This article pretty much sums up the extremes you can go to, in creating the ideal font spacing, sizing, etc. Review it, think upon it, and go forth and make beautiful typography. 

“The better we get at getting better, the faster we will get better.” – Engelbert

07.04.2013

Have you ever had the battery die in your optical, wireless mouse and not had replacement batteries. Try getting anything done on your computer without a mouse. Pretty impossible eh?

Doug Engelbart, the inventor of the mouse, creator of early GUI elements, pioneer of ARPANET,  and 1,000,000 other visionary, smart things you will never achieve died Tuesday.

He was even creating epic, future-predicting, keynote presentations, years before you were born. To steal from NPR, who said it best:

In a video from 1968, Engelbart demonstrated the capabilities of not only the mouse but also of the power of networked computing. Titled “A Research Center for Augmenting Human Intellect,” the presentation gained a more informal name over the years: “The Mother of All Demos


I can only hope that we have more brilliant, passionate people like this in the future of engineering.

Ol’Honest Abe

06.22.2013

More about the Lincoln half of LunarLincoln. Why Abe? Why not LunarTaft? Who has his own huuuuge rocket seat, for his impressively large posterior. Or LunarHarrison, who only get’s to be king of the moon for 32 days because he refused to wear a full spacesuit in order to “look cool” and catches a space-cold. Or LunarJackson, who takes 100,000 lunar aborigines on a death march. That guy, why the hell is he on our money, what a douche.

Aside from my general disdain for Andrew Jackson (Louisiana Purchase excepted), Abraham Lincoln was selected not only for his wonderfully alliterative name, and the fact that he has a bad ass line of cars named after him, but because he was such a complex and impressive president. Not as likeable back then, as he is today, Lincoln faced daunting challenges and rose to the occasion on many fronts.

Screen Shot 2013-06-05 at 12.15.46 PMScreen Shot 2013-06-05 at 12.32.05 PMHere at LunarLincoln, we only hope to be as progressive, inspiring and helpful to our fellow people as the 16th president was.

On a lighter note, when putting together the graphics for our website, we discovered older Lincoln is not suited to the space-look. A bit too grizzled once placed in a helmet, younger Lincoln made a much better/friendlier representative for our company. For your enjoyment, some initial versions can be found to the left.

Color Palettes

06.21.2013

So, as you may have seen on the twitter, I am not a fan of the color palette’s used in the new iOS redesign. I get where they are going with the flatt-er UI and the simplification – that is all well and good (though they put out what seems to be rough, first drafts). But I cannot get the Lisa Frank color gradients. I loved Lisa Frank – it was the only coloring book that I colored EVERY SINGLE PAGE of in elementary school, but that’s just it love”ED”. The neon gradients need to stay in the 90′s along with stirrup pants and windsuits.

Why so annoyed? Color is important, color can be the critical point between meh and yeh. With the Lunchtimer app, we spent a lot of time looking at color palettes – and a lot of time lining up screen shots of combos next to each other until my desktop looked like the paint-chip counter at Home Depot. I actually like to look at home decorating sites to get ideas – the colors are broader and more varied there than the tiny little squares most palette sites give you. I think we finally settled on something really nice and fresh but not too trendy. Sneak peek to the left here.

Anyways, aside from designing and selecting color palettes, below are some links to some interesting things I’ve been enjoying lately (and are thematically related)

DesignSponge – History of Colors Series
RadioLab Colors Podcast – Which I reference at least once a month
HowAboutOrange – a design blog I love, that happens to feature A LOT of orange.

Introducing LunarLincoln

06.17.2013

LunarLincoln is live! Wiley was ready to lay down some endless rocket metaphors for you, but I stopped him. You can thank me later.

So why LunarLincoln? Other than being a wonderful alliterative combo, and very SEO friendly (ew SEO), it combines a love from each of us. The Wiley-Lunar side – an obsession with all things space (I have seriously listened to When We Left Earth THREE times while working in our office, thanks to him) and the Lincoln-Jennifer side which combines a long-standing love of history, and a particularly favorite halloween costume. Together this combo will send us TOOO THE MOOOOOOON. (Dammit, I already used that line in the footer of the website)

But really, our knowledge, skills, drive, and determination have no end in this venture. We are excited to begin, excited to help others, and excited bring new, fun ideas to app stores across the interwebs.

Commence mission launch in three, two one…