spacer Design Great Products Faster

About | ZURBlog | Sitemap

Services

We'll help you get online products designed better and faster than ever before and set you up for future iterations.

Let's Work Together →


Foundation

We developed the most advanced responsive front-end framework in the world and made it free-for-all.

Discover Foundation →


ZURBapps

A powerful design suite that will help you prototype, iterate and collect feedback on your product design.

Get Started →


Expo

We think anyone can design great products. We'll share our ideas, thoughts and design resources to show you how to do it.

Learn More →

How Foundation Helped Evernote Build A Great Developer Site

March 07, 2013 in Implementation by Forrest 1 comment

We're always excited to see larger companies adopt Foundation for a variety of different front-end projects. Evernote, a Redwood City-based startup company empowering the world to remember anything, decided to use Foundation to build their developer's site.

We reached out to Chris Traganos, Evernote's Senior Web Developer (pictured below), to learn more about his insight behind choosing Foundation, and learn how Foundation helped him and his team build an amazing developer's portal for the company.

spacer

What is the Evernote Developer Portal?

Our developer portal is the home of our API documentation and technical resources for building apps with the Evernote platform.

What led you to choose Foundation?

Having built many sites, I have created common CSS resets, HTML structure, and grid-based layouts. Once responsive design took off, I spent some time researching the various frameworks that could give me a head start. Foundation was the best in class.

How did Foundation make your design and development process easier?

As a web developer/designer, I often research the common best practices for elements such as normalized header typography, line heights for mobile vs desktop, and what proportions the column and gutters should be on all devices. Foundation is an amalgamation of these common rules and gives you the base for starting off smart.

What part of the design that you feel most proud of?

Two aspects that I am excited to have on our developer portal is (1) being one of the first responsive sites for API documentation and (2) collaborating with our in-house artist Carlos Rocafort IV for the "geek art" found on the top of the homepage. You'll find lots of subtle elements such as dev tokens, api keys, rubix cubes and other easter eggs!

How will the new site drive more developers to build on Evernote?

Our developer education manager, Brett Kelly, has been actively revamping all the aspects of the documentation and curriculum for the Evernote platform. With the new "Getting Started Guides" for iOS, Android, and Python -- we are aiming for providing tools for helping developers learn a new programming language all together. The more of a resource we can be for the dev community, the better off our community will be.

What is the biggest business goal or vision for where the Developer's site will go in the future?

We are piloting more courses and classes for building on the Evernote platform. With over 20,000 developers building on the Evernote API, we are focused on making our platform ubiquitous with smart backups for a user's notes, in addition to adding value to great third-party applications syncing to Evernote.

For more insight behind their new developer's site, head on over to the Evernote blog.

StockTwits CEO Howard Lindzon: Invest in People

March 06, 2013 in ZURBevents by Ryan 1 comment

We had a great deal of fun at our first soapbox in our new Command Center. Howard Lindzon, CEO and Co-Founder of StockTwits, was a blast. He let slip that he once wanted to be a stand-up comic and it should in the zingers he made. But he also threw down some great insight.

spacer

One thing that stuck in our minds was when he talked about investing in people and ideas rather than scale. He said some folks are all about scale. But he's more into people with domain expertise, people who know what they're doing and talking about. Scale, Howard said, comes from social leverage when you do consistent work.

But with any investment, whether it's financial or not, you can't be overly serious. You can't get angry at mistakes or losing out on a winning bet. As he put it:

You've got to have a sense of humor about it. And you've got to talk about the stuff you're wrong about more than the stuff you're right about.

That's just one of the insights rom our conversation with Howard. To hear more, just jump over and...

Get More Great Takeaways »

Great Content Transcends Devices

March 05, 2013 in Sparks, Business and Startups by Ryan 3 comments

We've been having more and more conversations around content and mobile lately. Last week, while we were in the midsts of releasing Foundation 4, Bryan made an observation on how we have to take a critical eye to how content is placed in a mobile context. Which brought to mind, does that mean mobile also changes the way we write that content?

The other day, we came across LukeW's notes on Karen McGrane's talk at An Event Apart, "The Mobile Content Mandate." What particularly caught our eye was this bit in Luke's notes:

There is no such thing as writing for mobile. There is just good writing.

Mobile is a catalyst that forces you to write better, more concise copy without sacrificing clarity, Karen stated. There's no need to write separate copy for desktop, tablet and smartphones. If the content is well-written and engaging, it can carry you from device to device.

After all, well-written content in concert with form elements and visuals can make a page more desirable to use, regardless if it's on a desktop browser or a mobile one. But what makes good copy? SEOmoz says that great content has the makings of:

  • Credibility: Think of this as write what you know. Better yet, write to your expertise, your strengths.
  • Real effort: It really shines through when a post is well-researched and the writer has put time into it. That care shows.
  • Actionable: This is the takeaway that urges readers or users to take action
  • Begs to be shared: Good content is something that needs to be shared, but you should also want and be proud to share it.

But that's not to say there isn't a need for a mobile strategy, that you don't have to plan out how best to structure your content. It's a good rule of thumb to have just that. However, what Karen is saying, in the end, is that if you have all the makings of great copy, you don't need to write specifically for mobile. That your copy will transcend the device it's read on.

Our Next Soapbox: Why You Should Give Up Peanut Butter

March 01, 2013 in ZURBevents by Ryan 1 comment

We had a lot of fun last Friday at Stocktwits CEO Howard Lindzon's Soapbox — the first in our new Command Center! It was a blast as he regaled us with stories about Twitter and Stocktwits. We'll have more on that soon, but we have another Soapbox next Friday, March 8, we want you to know about first.

Without further ado ...

Brad Garlinghouse, CEO of YouSendIt

spacer

Three-and-a-half years into his tenure as a Yahoo exec, Brad Garlinghouse had an epiphany in the wake of a news article that, as he put it, publicly flogged the search engine. He realized that the company lost its desire to win somewhere along the way. That it was investing in far too much, spreading itself as thin as peanut butter on slice of Wonderbread. And in a moment of Jerry Maguire-fury, he wrote what became the "Peanut Butter Manifesto".

In that memo, he took Yahoo to task for losing focus and not having a clear vision. He stated that there was a lack of ownership, accountability or decisiveness. Or as he wrote:

We have lost our passion to win. Far too many employees are "phoning" it in, lacking the passion and commitment to be part of the solution.

He urged the company to change course before it was too late, or "stop eating peanut butter," as he said. Now Brad, as CEO of YouSendIt, is planning to steer the file sharing company in a new direction.

Which is why we're excited to have Brad drop in next Friday to tell us about why companies should avoid peanut butter and to tell us more on how his charting new horizons for YouSendIt.

RSVP now for Brad Garlinghouse's Soapbox, Seats Are Limited

Where:
ZURBHQ
100 W. Rincon Ave.
Campbell, CA 95008

When:
Friday, March 8, 2013
from 12:00-1:00 PM

Lunch and drinks will be provided

RSVP Today for Brad's Soapbox »

Foundation 4 is Here: The Smartest Foundation Yet

February 28, 2013 in ZURB, Implementation by Jonathan 80 comments

spacer

Well, it's that time again. We're pretty excited.

After hundreds of hours of discussions, experiments, hackathons, pull requests, visual explorations and decisions, we're thrilled to announce that Foundation 4 — the largest update to the Foundation Framework yet — is available right now.

Like its predecessor, Foundation 4 wouldn't be possible without the support of the entire ZURB team and our advisors. We also need to thank all of you who submitted issues, made feature requests, wrote pull requests and just generally drove the community effort around Foundation. Your support (or in some cases, relentless pursuit of better code) is a big part of the success of Foundation.

Foundation 4 is a bit of a different animal. Ready to dive in?

Mobile First

ZURB advisor Luke Wroblewski has been beating the drum on Mobile First for a while now. And in large part because of his insights here, we've retooled Foundation from the ground up to be Mobile First. This is no hack job; we didn't just flip some media queries and call it a day. We went through the framework and rethought how grids should work, how components should work in a mobile-first paradigm, so we could be sure the solution we deliver in Foundation 4 is smart and sturdy.

Now when you use Foundation, the layout you write by default will be built for a small device — something that may not even support more complex layouts or grids or media queries. While smartphones are getting bigger each day, there's an enormous group of people out there using older devices, who want to see your site. With Foundation 4 you can let them — the basic layout construct in Foundation 4 will work all the way back to feature phones.

Foundation has always prided itself (Can a framework pride itself? Why not.) on the Grid, the responsive layout engine that now drives thousands of sites. In Foundation 4, the grid has become even more flexible and even more powerful, with built in tools for different device sizes and a new, simpler syntax that better reflects how the grid works and how it should be used.

That's just some of it — dig into Foundation 4 and see some of the extensive work we've done to make it the best implementation of a Mobile First philosophy ever. If you're used to Foundation 3, we've also written a migration guide so you can better understand the changes.

All Semantic

Frameworks up until now have had one a major Achilles' heel — they required presentational classes all over your markup. Rows, columns, tabs — all kinds of classes that dictated not just what something was, but how it looked. Well, no more. In Foundation 4, with the magic of Scss, you can now remove almost all of the presentational classes from your markup.

We've built Sass mixins and extensions for almost every component of Foundation. Now you can write whatever markup is most semantic, most representative of what your content really is. Then, simply attach Foundation components to it in your Scss. For example, you might have a main content section and a sidebar: on a large screen you could attach eight columns to the main content, and four columns to the sidebar. If you ever want to change it later you simply change your Scss, and your markup stays the same. Pretty rad, right?

Sweet New (and Speedier) Javascript

We've been building plugins for Foundation for some time now, starting with Orbit and Reveal and then adding in Joyride, Clearing and Magellan. With Foundation 4, we wanted to make sure that not only were those plugins the best they could possibly be, but also that we were setting Foundation up for even greater plugins in the future. So, we rewrote them all.

Foundation plugins should now conflict less with other libraries, work better with AJAX, be easier to turn on or off and, on top of all of that, be faster and lighter.

We're also using Zepto.js, a jQuery API compatible library. This dramatically reduces how much your users will need to load (especially on mobile devices) and provides the added benefit of using CSS for animations, taking advantage of hardware acceleration where possible. And if you need jQuery, just swap it in — everything will work just fine.

Go get it!

Foundation 4 is available right now from foundation.zurb.com, and just like Foundation 3 you can use the Sassified version to take advantage of the new semantic options or you can grab the default / custom CSS downloads. We even rewrote the customizer to be more reliable. We love you guys that much.

We're having a great time working on Foundation and making it available to all of you, but we also need your help. If you see issues or have questions please let us know through our Github page or our Twitter account.

We hope you love Foundation 4 as much as we do (or at least almost as much — we're quite fond of it) and that it'll help you make more semantic, mobile-first and responsive sites. And just like last time, we need a beer. Want to get one with us at the launch party?

Chatting with LukeW on Mobile First and Foundation 4

February 27, 2013 in Business and Startups, ZURB, Implementation by Ryan 9 comments

The other day, our friend and advisor Luke Wroblewski stopped by for a chat with Jonathan, Chris and myself. We're in the midst of working on the finishing touches to Foundation 4, polishing the chrome and making her seaworthy. And Luke's visit was a pleasant distraction.

spacer

Luke turned us on to Mobile First and his work has greatly influenced how we're approaching Foundation 4, which we talked about during our conversation with him. While we talked, Chris was furiously pounding away on the code — he can pat his head and rub his tummy at the same time.

Some good stuff was said and we didn't want you to feel left out. Here are a few snippets from our conversation:

Mobile First and Responsive

Luke: Step out to any street corner and people have their face in a smartphone. That trend doesn't show any signs of letting up. In fact, it's constantly growing. I think the whole idea of Mobile First is reaching all these audiences anywhere and everywhere. 'Cause you can pull out your mobile device anywhere and everywhere. All the kinds of things people are doing are all the kinds of things we used to make websites about — buying things, looking up information, talking to their friends, killing some downtime, anything and everything is now mobile.

Mobile First, in a responsive paradigm, for me, forces you to focus on the stuff that matters, front and center. So what you see is people designing things desktop site down. What you end up is that they cram everything and the kitchen sink into the site. They make it huge and bloated in terms of performance, in terms of content, in terms of features. What they end up doing to get down to a mobile view, they stack everything into one long list. It's huge and it takes forever. It basically creates a crappy mobile experience.

Shifting Paradigms

Jonathan: We're doing something different with 4 than we did with 3. When we did 3, we said "2 is dead." With 4, 3 is still there. Because even with our clients, it's going to be another year of us beating the drum as much as we can to get our clients to sign up doing things Mobile First.

The nice thing about Foundation is we've always built Foundation so that it's probably six months to a year ahead of where we are.

Luke: That's an interesting philosophy. Sorta building ahead of where your clients are and bring them there over time and learn the lessons.

Jonathan: We have to drag them kicking and screaming. On the way, we get there ourselves.

Luke: I talk with a lot of companies around this sort of stuff. All of them know the terms. They know responsive web design. They know Mobile First. They know that they should be acting on it. But what's really holding them back is their existing properties and processes. To be clear, what makes people uncomfortable is that it's a different way of working. It's different than what we've been doing for 20-plus years.

My counter argument to that is that it's a pretty different web, pretty different world than it was 20 years ago. If you're expecting things that worked for you 20 years ago work today, I don't think that's a viable way to run a business.

The other argument that I hear is that it costs more, takes more time. My response is: OK, so you can keep making a desktop and laptop site and just not have all these new audiences on tablets, on smartphones and all that stuff. If you want more usage on these more devices, more online time, you have to invest a little more. It's not going to come for free. Nobody just comes hands you a pile of money or customers if you do nothing.

Jonathan: At some point, it's just going to be the cost of doing business.

Forward the (Mobile First) Foundation

Jonathan: Luke got us turned on to the whole thing. We had lunch ... how long ago?

Chris: Back in November ... maybe September ...

Jonathan: About six months ago, we had lunch with Luke. And Luke was like beating us over the head with "Foundation ought to go Mobile First". And we talked about it before but that was the first conversation where we got to the end of it and was "like OK that makes some sense."

Chris: He made us look at Zepto too.

Jonathan: He turned us on to Zepto. So that was a good conversation. I think it was a confluence of — he made a pretty good case for it. Honestly, I think, at last to me, the best case so far. Since we're doing things mobile first, technically, we have the capability with Foundation to build experiences that don't suck for like really old phones and feature phones. We're not going to inherit all the styles we try to cram in there. It will actually be a mobile site.

So we can broaden our appeal by simplifying what we present for devices like that or older browsers like IE6 or 7. You could reasonably say you can build a site for IE6 using Foundation 4, which wasn't the case with Foundation 3. That was a win.

Luke: To build on that. The promise of tomorrow, for me, is more and more multi-device web. There's no shortage of devices.

Toward Tomorrow and Beyond

Luke: I think that it's encouraging to see that more and more people are understanding this opportunity and jumping on it. You guys, potential working with clients, using Foundation — it's a great vehicle understanding kind of what they're inevitably going to have to do on the Web. I appreciate that you guys are moving it forward and pushing it past where the clients are right now. In the end, I think it's going to be good for you and for them. It's not a negative thing for me. I do agree that change is hard. It's inevitable to deny that the mobile thing is here. And you're going to have to deal with it. And eventually deal with it in a good way.

Jonathan: Pretty stoked to where Foundation is going. We wouldn't have taken the direction we did if you hadn't badger us for the last year and a half.

We want to thank Luke for dropping in and chatting with us!

Mobile is No Longer a Choice

February 26, 2013 in Business and Startups by Bryan 4 comments

Over the last few years, we've heard many of our customers dismiss the need to address their web presence on mobile devices. It was understandable considering the small mobile adoption rates of their Enterprise customers. But it's no longer feasible for any business not to think about how they're solving problems for the Mobile Web. Mobile growth is outpacing desktop usage, and people are becoming more comfortable getting work done on portable devices.

We can use our own business as an example. We're a business-to-business company that has quickly shifted to a multi-device office. On a regular day at ZURB, you'll see people sketching on iPads, projecting design work on a TV and reviewing agenda notes on a phone.

For some customer perspective, our newsletter email opens are now 40% mobile. 7.5% to 20% of our visitors come to our various properties on a mobile device. Those numbers continue to climb each month for us, especially overseas. Comscore is reporting that 1/3 of all page views in the UK are from a connected device.

It's our hope with the upcoming release of Foundation 4 that many business will not only make the decision to move forward, they'll look to start their efforts around small devices first. It's a concept our advisor Luke Wroblewski has been pushing for quite some time: Mobile First. With the proliferation of connected devices and US mobile usage surpassing desktop in 2015 (it's already happening in India), designing the mobile experience first is a solid bet. Actually, you really don't have a choice if you want to remain relevant.

Foundation 4 Sneak Peek: Sectioned Content

February 22, 2013 in Implementation by Jonathan 8 comments

The release of Foundation 4 is fast approaching (less than a week now, the Yeti is lumbering out of his cave as we speak) and we wanted to share another sneak peek at some of the frankly extensive work we're doing on the framework.

With the mobile-first component of Foundation 4, we realized that some components could be much better abstracted — to better support devices, and to give you more flexibility. The example we'll show you on Forrst today is sectioned content, a replacement for tabs, accordions, and even drop down nav. Any time you have content in sections, with labels, and want a way to switch between them? Got you covered.

Check out the whole story on Forrst including markup, Scss, and JS code you could actually grab and play with yourself. We're excited to be sharing Foundation 4 with all of you next week!

Foundation 4 Sectioned Content

Is Google Glass Limiting or Liberating?

February 20, 2013 in Interaction Design, Sparks by Ryan 9 comments

We've moved beyond devices. Our smartphones, our tablets have become extensions of ourselves. And the most perfect example of this is Google's upcoming glasses Certainly, it's the most organic, electronic extension. Yet it might be the most limiting.

WIth Glass, we'll see the world slightly differently. Products, apps will all be within the blink of an eye. Now Google has given us a peek into how folks will interact and use the device. Check out this video and notice how it might not be as liberating as you might think:

A lot of the interactions are through voice, which could hinder where Glass could actually be used. Sure, it'll be terrific in a car, where we're handsfree. But we know how frustrating using voice commands can occasionally be (we're looking at you, Siri). For example, Siri:

  • Can't deal with heavy accents
  • Misinterprets voice commands
  • Doesn't support many other languages
spacer Image via Google

That's not to say that they aren't advantages. There are. Like we said, it's convenient for remaining handsfree while driving, especially when sending text messages. You don't have to use your fingers to actually use your phone. And Glass seems like the next step in this handsfree evolution. But you can't use voice all the time.

Think about it. You're in a library and you need to Google something. It becomes difficult to use voice commands, you might disturb others. Or the reverse, you're at an outdoor concert with wind, crowds and speakers. The noise might render your Glass useless. It wouldn't be able to make heads or tails of what you're saying. You won't be able to tell it to record the concert or snap pictures of your friends. And for those of us that wear prescription glasses, we might be out of luck (although, we could foresee a prescription model down the road). And using them for scuba diving might be a bit difficult.

Right now, it also seems that you'd be completely reliant on voice, so you won't be able to manipulate data. Although, that might not be too far off.

While Glass might seem limiting, it's still exciting to see this one step closer to being in our actual hands. For all it's limitations, there's plenty of more opportunity opened up by it. How do designers work around these limitations? How do we build products where we can manipulate data or tools without the use of our hands or gestures, only our voice?

Limitations are only constraints by any other name. And those can only force us to design smarter and can actually be liberating.

The Trek from Portugal to Intern to ZURBian

February 18, 2013 in by Shawna 12 comments

When it comes to world domination, we mean it. Even when it comes to finding the newest member of our team. Our newest ZURBian comes from the far end of the world. OK, not that far, but Portugal is far from our command center in Campbell, CA.

She made the trek from her homeland to become a design intern. But we're glad that has become one of us — a full-fledged ZURBian. So without further ado, may we present ...

Ines, But You Can Call Her ibie

spacer

Ines, or ibie with a lower-case "i" as she likes to be called, spent her childhood days exploring the woods of Portugal with her cousins. She also had a bit of a mischievous streak, plundering the fruits of her neighbors' trees. She tells us, however, that most of her neighbors were relatives, so it wasn't exactly stealing.

Eventually, ibie stopped her life of pillaging fruit and got a degree in Visual Design. She later earned a master's in Visual Culture, which is the study of visual signs of a particular culture, everything from film to video to old school print.

With degrees in hand, ibie left home to explore the world and make her mark. She found herself in the U.S., hunting for her dream job. There were some sour months. But she didn't give up. Then she found the perfect opportunity, an internship at ZURB. And boy did we put her to work, helping redesign our Soapbox pages.

But she gave the redesign her all and we decided to bring her onboard. So please everyone let's give a warm welcome to ibie, our newest ZURBian.



  • 1 of 81
  • Older »
gipoco.com is neither affiliated with the authors of this page nor responsible for its contents. This is a safe-cache copy of the original web site.