Working out a Math Problem | BIT-101

I love how math creeps into design, programming and other problem solving.

I had some fun playing with Keith’s code (as usual). I’m always impressed with how he’ll see a problem and eventually at least figure out how to solve it using math/trig/physics. It’s a breath of fresh air and it almost makes me wish I was a math teacher and I could whip the example out whenever a student says ‘how is math useful’. I use it and even enjoy using math in my work to solve problems and it what bits I paid attention to in school still really help me.

Anyways, Keith was trying to figure out how to have a ring of a certain number of exactly touching circles around one central circle of a predetermined size. Sounds like a perfect bonus question from trig, right?
Here’s his post: Working out a Math Problem | BIT-101. And then his follow-up post where he gets to what I was expecting in some nice renderings showing how he’s using this simple pattern to make some really interesting designs.

I commented that I liked his problem solving procedure and was interested to see it animated! I love how math creeps into design like this. So I toyed a bit with animating the form. Check out my jsbin at http://jsbin.com/icahul/132/edit.

Posted in blog | Tagged , , , , , , , , , , | 3 Responses

Adding Viewport Meta Tag via WordPress Theme Functions

Add the viewport meta tag with a WordPress hook via your theme’s functions file to allow responsive web design and mobile-friendly themes

meta-viewport-thumbWith all the responsive web design activity over the past few years, I hope that any theme or site we work on we’re able to make responsive to some extent. An important part of making a web site responsive is adding a viewport meta tag to your html. Without explicitly stating our viewport, the mobile browsers will scale down the website to fit into their ‘viewport’. This is a good thing, since if it was a full website and the browser didn’t scale it down, you’d only see the top left corner, or some small section of the site. This viewport was introduced by apple for iOS and has spread to most mobile devices since. There are viewport properties or parameters we can set with this meta tag such as width and scale and can even use some device aware variables (like ‘device-width’) to set these values.

A WordPress Meta Viewport Hook

I usually end up using the following hook to add a viewport meta tag to my head in wordpress. I set the viewport width to match the width of the device. Then I set the initial scale to 1. Some go and set the maximum-scale to 1 as well. This would prevent users from zooming in on your site. I advocate that we should allow users to zoom if they wish since it is a gesture they may be used to and may still need (no matter how nice your RWD is, they may need/want to see it bigger). RWD is about giving the user a better layout for whatever device they are on, not restricting how they view it.

1
2
3
4
5
6
7
8
9
/////////////////////////////////////////////////////////////////////////////////
// Add viewport meta tag to head
//
function viewport_meta() {
    ?>
        <meta name="viewport" content="width=device-width, initial-scale=1"/>
    <?php
}
add_filter('wp_head', 'viewport_meta');

There are plugins that will do the same, but if you are building (or editing) a theme, this should really belong in your theme along with all your responsive css. It’s as easy as this.

And that reminds me, I haven’t (yet) done this on this site because I still haven’t found the time to make my sorry site responsive. Believe me, it’s on my list, says the barefoot cobbler’s children.

Posted in tutorial | Tagged , , , , , , , , , , , , , , , , , | Leave a comment

3 Plugins that Improved My Workflow in 2012 – WP Daily

I’ve guest authored a post on wpdaily.co: 3 Plugins that Improved My Workflow in 2012.

The post describes the 3 plugins that I used during the past year which transformed my workflow (in good ways). They are BackupBuddy, Gravity Forms and Advanced Custom Fields.

Have any comments? Favorite Plugins? Please, jump over to the post on wpdaily.co and add to the discussion!

Posted in blog | Tagged , , , , , , , , , , , , | 2 Responses

A Practical Guide to HTML & CSS – Learn How to Build Websites

I came across Shay Howe’s website today for the first time and am very impressed with his learn section. He’s created the content for a course (or 2) to learn HTML and CSS. There is a beginner’s guide and then an advanced one is scheduled too. This is great content or curriculum and would be a great boost to anyone interested on the subject. It is very thorough and teaches good practice with bad vs good examples throughout.

learn-html-css
A Practical Guide to HTML & CSS – Learn How to Build Websites
.

http://learn.shayhowe.com/html-css/
http://learn.shayhowe.com/advanced-html-css/

Posted in blog | Tagged , , , , , | Leave a comment

Mobile Strategy and the Case Against Apps

Great points about apps and the web in this article.

Apps compete with the web for dominance over where people get their content. Apps as games and tools are perfect, but apps for content are not. Content is best on the web, because the web is built for sharing content. The web is open! The web is consolidated and instant and accessible (meaning that any device/browser/screen size/location/etc can already access the web and you can update it anytime and all users see the update instantaneously). The web is also accessible via the defining url. Meaning that it’s a required standard that all assets and bits of content have an address. You can take this address and share it and return to it easily, apps – not so much. You want to share an experience or idea from an app with a friend (sure, some have a process built in), you first check to see if their device has this app available, they want to go through the steps of finding the app and then installing it (likely having to pay money) and then you send them a link have to explain how to get to where the magic happened.

Newfangled, a web agency I respect for being very smart has a great article about this. It was then moved into the basis for a chapter in their ‘The Strategic Web Designer’ Book. I highly recommend them both!

Planning a Mobile Strategy.

Posted in blog | Tagged , , , , , | Leave a comment

SoFresh! – It makes your CSS yummy.

SOFresh-ssRecently, I stumbled on this tool that has really helped my development process. It keeps my css file(s) current in the browser as I edit and save them. Before this I’d make an edit, save/upload (which I’ve combined into one step with SublimeText) then switch to the browser and refresh the page and/or clear cache to make sure the latest edits are loaded. Then rinse and repeat. But now with this tool I’m able to save my edit and glance at my browser as it auto refreshes the stylesheet once it notices the new file (usually about 1 second) and I see my edit, and continue with my edits. It may seem small but after doing this dozens and perhaps hundreds of times each day you can understand the simplicity of this!

[Before I used a javascript based tool called CSSRefresh which would just automatically reload the css file every second. Which had the same effect, but was a heavy consuming load on the browser as well as on the server. It ended up making the browser go much slower (especially when scrolling) and it crashed it often. Sadly, I was forced to accept the tool as a flop for my workflow.]

SoFresh is a bookmarklet based tool though. It allows you to specify a css file or more to ‘watch’ and then when the file changes on the server it smartly reloads it, saving me the trouble to switch apps reload page and wait and potentially reload while clearing my cache. My refresh and cache shortcut keys are much happier now and I take a breath every time I save an edit.

SoFresh! – It makes your CSS yummy..

Posted in blog | Tagged , , | Leave a comment

HTML5 Is Ready – Rebuttal to Facebook’s native app

Here’s a great “HTML5 Love Story” about the team at Sencha, who is passionate about using proper technologies for the one open web, who knew better than to trust that the failure of Facebook to create a reliable HTML5 app for users was because HTML5 wasn’t ready (as Facebook claimed). They built this demo to prove that HTML5 can do all that the now gone native FB app does and faster. The trick is you have to know what you are doing. Something it seems, FB doesn’t. Ready the full story and watch the comparison video: The Making of Fastbook: An HTML5 Love Story | Blog | Sencha. Or go try it yourself. Visit http://fb.html5isready.com on your favorite mobile browser.

When we started what became Sencha, we made a bet on the web: a bet that modern application development didn’t need anything except the browser, a great set of frameworks and a great set of tools. With those three weapons in hand, we knew developers could build applications that would delight users. The advent of HTML5 upped the game and it gave developers even more tools to let them treat the browser as an application development platform and not a page rendering engine. Developers sprang at the opportunity and unleashed a torrent of apps — on both desktop and mobile — that leveraged the new HTML5 capabilities to build amazing applications using web standards.

So, when Mark Zuckerberg said HTML5 wasn’t ready, we took a little offense to the comment.

We thought to ourselves: HTML5 can’t really be the reason that Facebook’s mobile application was slow. We knew what the browser on modern smart phones was capable of and what kind of rich capabilities HTML5 offered. We saw the latest generation of mobile devices — running at least iOS 5 or Android 4.1 — push ever increasing performance and HTML5 implementation scores. But perhaps most importantly, we’d seen what our customers were building and the amazing things they were creating using HTML5.

I totally agree with this sentiment and believe that native apps are the new flash to the web. They are fun and seem to be the way, but give it a few years and these native apps will quickly give way to web based apps that are browser based and offer speed and flexibility and consistence to the web experience. Sure, flash can do things that html still can’t. But I’m pretty sure no one would want to build their whole site in flash today. They would put the parts that need to be or the parts that belong in flash in flash and let the rest be standards compliant open web. Facebook has essentially built a flash based website for phones to access their website content. They will have to maintain and update this separate from their “real” version.

Our smart phones are helping us converge our devices, as in we no longer need a phone a camera a gps a notepad a … But it is not helping us converge our internet or content. We currently need to use a website in one way at our desk and another way on the go. Websites and the internet should have the same capabilities and the same uses no matter where we decide to use it. Sencha is showing us that, built correctly, HTML5 truly is ready to handle many things that belong in the browser rather than in a native app. We should never need to download a native app to access website data that we normally would just login at our desk. That’s inefficient, divergent and complicated. It’s against the openness and standards everyone preached and pined for and indeed “won” when flash-haters succeeded in ousting flash from mobile browsers. I actually respect Adobe for finally pulling the plug there because they too, believe in the web (and at the time, I was a full-time flash developer). I believe in the web too and that’s why I call it the one open web.

Posted in blog, review | Tagged , , , , , , , , , | Leave a comment

Randomness and Unicorns for Programming

book

Programming seems to have a gulf dividing the playful and the useful. The random and scripted. The fun and the business. KrazyDad writes the book review and calls for a concerted effort to close this gap. The pleasurable and “recreational programming” mindset seems to be giving way to OOP and other acronyms that do little to inspire new programmers to experiment. While I agree I also think that the web of today makes a lot of old boring aspects – now playful. There are things like the 1K competitions, and all the magic that is now coming our with these new CSS3 properties. Although it’s not enough, I think there is at least a spark of it, and agreed it could be better in that it could be easier for newbies to jump in and experiment without understanding so much first. Thanks for the book recommendation Jim, I’ll add it to my list and hopefully get an into to BASIC.

For a long time, the amount of joy I derived from writing software was proportional to the amount that the features depended on randomness. There is a relationship between the RND() function and the perception of utility. To me, programs that are useful, and that do not require randomness, are useful, but boring — they fill out your tax return and monitor patients in hospitals. The RND() function is like a firehose from God, and the programs that use it are useless, but fun — they are games, and simulations, and art.

KrazyDad » Blog Archive » The mark of the unicorn.

Posted in blog | Tagged , , , , , | Leave a comment

Web vs Mobile – For The User

I agree with this idea from Ryan that the web has big advantages. I am constantly hearing stats and projections that Mobile is taking over. And sure, I agree that I use my phone to browse more sites, but when it comes down to it I’m just casually browsing – not working. I love the post he’s links in the first line: Vibhu Norby has a detailed post on why his startup is pivoting from mobile first to web first.

Vibhu details that he’s done the mobile startup thing and has learned from the complications. He explains that most of these have been solved in the desktop browser already and a lot of it relates to usability.

Another big point is that mobile apps must be installed (actually they must be found, installed, opened and setup), whereas a web app can be as simple as a link- click, and then the user is already using it. Adoption is much easier on the web.

And even another point is updates and testing and whatnot. YOu can do various tests and even update the whole app relatively fast on the web. There is the one version to support – the live one. While with apps, you can’t do much in the arena of testing and updating is sluggish plus it relies on the user to update (some don’t know how to update and even less care).

I think a web app that is mobile friendly wins. You can give mobile users access, but they aren’t stuck on mobile. They can use it anywhere. While so many are talking about responsive design and produce sites that are device agnostic mobile apps are very device centric.

I’m a fan/advocate of future friendly at least, and strive for future proof (although I understand that’s near impossible). I also hold that there is ONE web and mobile myths.

Web versus Native Economics and User Adoption | Ryan Stewart – Mountaineer Coding.

Posted in blog | Tagged , , , , , , , , , , | Leave a comment

Stats on a Windows 8 Game

The Falling balls app seems to be Keith Peter's "Hello World" in exploring new development arenas. Here he walks us through how his first app is trending on Windows 8.

Embedded Link

Falling Balls Update | BIT-101
At the end of October this year, Falling Balls was released into the Windows 8 Store. After just over a month, I thought it would be interesting to discuss how it is doing, and to answer the question,…

Posted in blog | Tagged , , | Leave a comment
  • Recent Posts

    speaker-lineup

    Presenting at WordCamp Atlanta – Child Themes

    The presentation? Your firstborn child theme. Child themes 101+2. I’m speaking at wordcamp atlanta this afternoon about themes and child themes. I’ll update this post with post-presentation notes. Learn how to mod themes the right way. Using child themes you won’t loose your edits when there’s a theme update. (101) We’ll go over the advantages [...]

    hooks-nutshell

    Hooks, In a Nutshell – WP Daily

    I’ve published another article over on wpdaily.co exploring the concept of hooks. I remember when starting out that people kept mentioning hooks and filters and actions and… it took a while to grasp what they each meant. I think the first time I started to grasp it was when I read the codex and saw [...]

    speaker-lineup

    Speaker at WordCamp Atlanta 2013

    I’m excited to be speaking at WordCamp Atlanta again this year! The time is quickly approaching for WordCamp Atlanta 2013, March 15-16. I spoke last year and discussed the process of going from Photoshop PSD to WordPress Theme, here are my slides and notes for that WordCamp Presentation. This year I’m speaking along the same [...]

    many-theme-options

    WP Features: Theme or Plugin

    Reading my wpdaily.co updates today and saw this post talking about WordPress theme features. Eric explains the debate: Generally-speaking, the conversations have always circled around features: There are those that believe every feature you could ever imagine should be included like text color, font selector, and more. On the flip-side, there are those that feel [...]

    Packery Preview, from Metafizzy & descended from Masonry

    David Desandro / metafizzy, maker of masonry and isotope of which I’m a big fan and user of has been busy with a new project called Packery. Packery, looks to be a child of Masonry. As you would expect it seems to be pushing things much further and addressing a few pain points of masonry. [...]

    trent-walton-thumb

    On Going Responsive (responding to Where to Start)

    I needed to write this up about going responsive in response after reading Where to Start (by Trent Walton of Paravel) about getting started with responsive web design. Thanks for sharing your thoughts Trent, I agree whole heartedly. In my experience it is the same. I wanted to share his post and also add my [...]

  • Recent Comments

    Evan Mullins

    Evan Mullins

    The keystore is used for creating valid apps that are associated with the author. It is not...
    Rohan Dave

    Rohan Dave

    I am new in android and have certain question about KeyStore. Is KeyStore used in user...
    arpit

    arpit

    very useful thank you …..
    Duan

    Duan

    @ugh You’re joking, right? I do some basics in Flash, but come on – all you do is...
    Cátia Vala

    Cátia Vala

    Thank you so much Evan! That’s great! Keep going with your amazing work. :)
    zproxy

    zproxy

    thanks :) i bet its faster to google and find some ad hoc documentation than the other way.