Posts Tagged ‘feature’

Developing for Unify – pt. II

Monday, March 15th, 2010

It has been quite a while since I wrote the first part of this series, but Unify has been going through a lot of changes in the last 6 months, and I wanted to make sure to address all of the new features and improvements that have been in development.

Please Note: Every new addition to Unify is rather well debated so that we can allow the app to be as simple and easy-to-use as possible. What follows here are best practices and suggestions to help you [designers & developers] understand how Unify works so that you can create the best experience for yourself or your clients.

So, without further delay: Here is everything else you may want to know when developing a site with Unify in mind.

(The features selected in this article are based on user input, so if you want to know how Unify works with your specific configurations, please peruse the forums or contact us. Thanks!)

Aesthetics

Much of our efforts in recent months have been focused on making Unify work with—or on top of—many possible server configurations (such as IIS and Apache), browsers, and content needs (such as tables and picture galleries). As much as this adds to the power of our app, it doesn’t do much for ergonomics. So as of version 1.2.0, we greatly improved the style rendering in the editor (before & after):

Editor Styles, before and after

…and improved the HTML editor by adding a full-screen view, syntax highlighting, and allowing tabs:

HTML Editor Comparison

IMHO: these screen-shots cannot do justice to the improvements. See for yourself in our live demo.

Working Locally

Unify requires a handshake with our server in order to log in, and perform many other tasks. This means that in order to operate Unify, you need a live internet connection. This does not, however, preclude the use of a local environment to develop for Unify. Just set up your local environment, purchase a Unify license for the eventual domain that you will be using Unify on, and install the files in the proper folder. Then alias your localhost to the URL of the destination domain. Done.

Files Permissions & Auto-Update

As of version 1.2.0, Unify can accept and save your FTP Info in the dashboard. This will fix any permissions errors you may be receiving when publishing. FTP info is also required for a nice new feature of Unify: Auto-Update.

With auto-update, you and your clients don’t need to worry about working too hard keeping up with the latest Unify fixes and features. Just go to the dashboard, check to see if you are running the latest version in the update box in the top right corner, and if there is a newer version, click “Update Now!”. To run the Unify Auto-Update, you will need the PHP cURL library on your server as well.

Video & Embedded Content

As of version 1.2.4, the Unify video embed wizard only works with OBJECT and EMBED tags, but we will be adding support for HTML5 video very soon.

To make any video (or EMBED or OBJECT) editable, just add the “unify” class to it. This will allow you or your client to edit the video specs in the video embed wizard. Options include changing the size of the element, or replacing the embed code.

File Uploads & Browsing

Users can easily upload, browse, and link to images or any type of file (besides PHP, HTML, CSS, or JS). Unify will even auto-discover folders to upload to, or you can set specific folders for images and files in the Unify dashboard. Once a file is uploaded, click the search icon next to any link or image source field to browse the available files and create a link.

Working with Lightboxes & Picture Galleries

All lightbox scripts work differently, so we cannot claim support for every one that is out there, but we have taken strides to make Unify flexible enough to cover most of what you would need. Every link prompt will include a “class” and a “rel” attribute, which should give you what you need to create a link that is compatible with most lightboxes.

To adapt a common picture gallery to be editable with Unify, try the following steps when installing Unify:

  1. Add the “unifyRepeatArea” class to the gallery container.
  2. Add the “unifyRepeat” class to each image (not the link).

Now, you or your client will be able to drag a copy of any thumbnail, and then edit it. In the Unify image wizard, you can create a new lightbox image by following these steps:

  1. Through the upload interface in the top-right of the image wizard, upload the large image first by selecting the appropriate folder, and then browsing to the correct image on your hard drive.
  2. Go through the same steps to upload the thumbnail. You should now see the thumbnail image in the top-left area of the image wizard.
  3. In the fields below the thumbnail image, add the appropriate class, link and rel that your lightbox requires.
  4. Hit “done”, and if everything looks correct, hit “Publish”.

Working with Tables

As of version 1.2.3, Unify should work well with most table configurations. Here’s how:

  • If you want your table to retain a static number of entries (or rows), just add the “unify” class to the TABLE tag.
  • If you or your client will need to create new entries, you can add the “unifyRepeatArea” class to the TABLE tag, and then add the “unifyRepeat” class to your TRs  (or TDs depending on what content you want to be able to replicate… although I would recommend only repeating the TRs).
  • In both cases: To prevent any editing anomalies, please make sure to set up your table properly in your CSS. For example, a TABLE should be “display: table;”, a TBODY should be “display: table-row-group;”, a TR is “display: table-row;” and a TD should be “display: table-cell;”. Also, try adding “table-layout: fixed;” to your TABLE for more efficient rendering. IE does not recognize these, but it manages just fine on its own.

Cufon & sIFR

Unify automatically disables Cufon and sIFR in the front-end when loading a page in Unify. This means that your text will look different, but after publishing and logging out, your content will look correct on the live site. This eliminates any incompatibilities between these scripts and Unify.

Tabs & Sliding/Animating/Hidden Content

If it is on the page when the page loads, Unify can edit it. With each mouse click, Unify evaluates which editable elements are visible and hides/displays the edit icons accordingly. It will also adjust the position of the icon, but this is not fool proof.

To make sure that your icons are displayed and in the correct place in Unify after a Javascript change to the page, you only need to add one line to the end of your Javascript function:

    if (top.window.createIcons) top.window.createIcons();

This will fire the Unify “createIcons” function and move the edit icons to the right place.

Working with Dynamic Content

Unify works with what is on the page when it is loaded. If you are bringing in dynamic content, Unify will not be able to edit it properly, so make sure that any content like a twitter feed, del.icio.us feed, or anything else that is brought in through Javascript is not included in a “unify” editable area.

Moving Forward…

We have many great things planned for Unify in the near future, so keep checking in here on our blog, or follow us on twitter: http://twitter.com/unitinteractive . Also, if you have any questions or suggestions, please tell us about it here, or in our forums.

Makin’ Days

Tuesday, February 9th, 2010

We didn’t have to create Just Made My Day. There was no imperative dictating the (at this moment) mostly unprofitable format, and definitely no room in the market for another site that lets users share updates about their lives. We did feel, though, that it was worth it to craft a little beacon of positivity on the oft-negative internet. It has been so good to us, after all.

The following is the casually recollected time line of concept-to-creation for Just Made My Day: Unit’s latest way to brighten people’s day:

Concept

Nov. 4th, 2009 — An idea comes to Andy while showering. Not specifically focused on anything, he thinks about how nice it would be to create a place online where “folks could just celebrate the cool things that happened to them, especially the cool people who did something nice for them”.

Nov. 5th, 2009 — Andy takes R.A. and me out for coffee. The trip is a Trojan horse laden with a new undertaking for Unit. It’s solid idea from the start: “Just Made My Day” (JMMD if you’re savvy) will be a site to allow users to easily share the little things that make them happy. We discuss the various implications, difficulties, and merits of launching such a site. Quick sketches and wire-frames are scribbled on scrap paper. R.A. uses phrases like “implicit moderation” and “social-media authorization APIs”. We emerge highly caffeinated, with a foundation for moving forward.

Design

Nov. 5th, 2009 — While watching a documentary on Monty Python—Almost the Truth: (The Lawyers Cut)—I think it would be nice to rip-off Terry Gilliam’s collage style for something. It occurs to me that JMMD would be ripe for experimentation.

Nov. 6th, 2009 — Although there’s no plan for me to design JMMD, I decide to get a jump on a look and feel rattling in my head. I spend a quite Friday morning making a collage of landscape elements. I want to create an impression that is inherently positive, and will behoove users to behave. While playing with more organic layouts of nature, I realize that a fully symmetrical approach allows the landscape to both be more pleasant, and act more as a background to the form elements, not a focal point. The resulting masthead gets me excited; I decide to finish a full design comp.

Nov. 10th, 2009 — I finish out a full comp of the site design. Somehow, the thrill is gone. I wind up with what I feel is a muddy attempt at redesigning Rotten Tomatoes. The design needs more simplicity, and serious amount of editing. It occurs to me that I’m riding a little too hard on the landscape concept; it needs to be a website, not an art project.

Nov. 13th, 2009 — I show Andy my design. We decide this is the right direction, but it needs some work. Angela later tells me about some great little games on the Xbox arcade.

Nov. 17th, 2009 — On Angela’s recommendation, I download Braid late one evening and am blown away by its ingenuity and pure artistry. Shortly before bed—still humming a haunting tune from Braid—I have a few design-related epiphanies. When I say them out loud, my sleepy wife does her best to act like I am smart, God bless her.

Nov. 18th, 2009 — I complete the design that will become JMMD. I make some tweaks to the form to give it affordance, and help it feel more balanced. Now, we’re ready to build this thing.

Development

Nov. 19th, 2009 — The entire Unit crew sees JMMD as an opportunity to push our knowledge. We have already begun delving in to HTML5, and this looks like another great opportunity to work with it. I think that a parallax technique will really make this design sing, and begin learning how to pull off such a thing.

Nov. 24th, 2009 — I finish the parallax effect, add some birds and the main title in Chunk Five, using some @font-face goodness via Font Squirrel. I put up a teaser site, and begin developing the rest of the site.

Nov. 25th, 2009 — I really want to make sure I am using HTML5 to its fullest, so I read up on everything. I start working heavily with CSS3 techniques as well. We discuss the ramifications of leaving Internet Explorer in the dust. We are okay with this.

Dec. 7th, 2009 — I finish front-end development. We decide WordPress will work best as an engine for posts. I begin integrating a theme and R.A. helps me build a set of plug-ins to allow users to post. Basically, we turn WordPress inside-out. Next, we begin learning authorization APIs for Twitter, Facebook, and Open ID.

Dec. 18th, 2009 — Early on, we decided that in order to lower the barrier for entry as much as possible, we would need to allow users to log in using social media accounts. We were sure they wouldn’t want to create and remember a whole new account for our little site. Twitter authorization (oauth) was the easiest (IMO). We test and then soft-launch JMMD without Facebook or Open ID integration. Over the holidays, we leak the site to a few friends and family, and allow some initial posts to build up.

Jan. 13th 2009 — I finish up Facebook authorization using Facebook Connect. We use RPX to allow Open ID. Next we fire up the Twitter clients and start telling the loyal web denizens of our latest project.

Epilogue

So far, response has been overwhelmingly positive. Even if it were a failure, though, this scrappy Unit staff was able to take a great idea from concept to launch in just over 2 months. We learned a lot and we are proud of the fruits of that labor.

Thank you to everyone who is making days, or sharing about days made!

Our 2009 Annual Report

Wednesday, February 3rd, 2010

We’re now just over 2 years into Unit Interactive’s existence and this is our first ever annual report. As we’re writers and designers, we’ve split the report into two components to best address both the real story and the fun trivia about our 2009. Here is where we’ll delve into what, for us, were the compelling moments of the past year. We hope you’ll enjoy both components as much as we enjoyed preparing them.

See the Graphic Report »

Our Mantra for 2009: We Refuse

As 2009 started, we weren’t experiencing crisis, but we were certainly surrounded by it. The deepening recession was showing its tangible effects in our market, as our designer and developer friends were being laid off and peer agencies were either scaling back or closing doors. Doom and gloom was the subtext to most market discussions. Like most folks we had clear reason for concern, but our optimism was holding strong.

Despite the global economic turmoil, by February we decided we needed another team member and by March we were turning down work because our project queue was too full. Then R.A. Ray joined us. Like Nathan before him, R.A. was a lucky find for us and a welcomed addition to the team.

By March, our contempt for the limp-noodle, doom and gloom sentiment in the media over the recession pushed us to boldly proclaim, “We refuse to participate in this recession.” We knew that we didn’t have to play by everyone else’s rules because of the winner’s exemption, which allows those who dare while prepared to craft their own rules. And as luck would have it, by April our business swelled to never-before-attained levels; well beyond what we’d planned for.

The latter half of the year was touched by some sort of fortuitous glamour. Just when our internal efforts to finish and launch Unify were required, our client project load cooperated flawlessly. After the Unify launch, our project inquiries jumped significantly, but there was a curious trend that followed. Most of the potential clients who inquired of us either fell short of our standards or the projects were somehow vaguely unsuitable. All of what followed had a bittersweet quality.

Having proclaimed just 6 months before that we’d not participate in the swelling recession, we were severely challenged to either demonstrate our conviction or see it crumble in the face of concerns. Truly, for any not yet convinced, the next few months proved to us that uncompromising standards have a very literal monetary cost. Instead of gathering a host of new projects, we were compelled to decline most of them. Just when the waning season required that we gather a bounty in preparation for the distractions of the holidays, our scruples demanded that we turn down much of the largesse offered us. It was a bitter pill to swallow, yet we held fast and looked to our belief that we could craft our own destiny.

Each time we decided to decline a project offer and we explained as much to our team (we don’t hide business mechanics from our team), our folks understood. Never once did anyone here indicate even the slightest concern, or deign to second-guess any choice to avoid a lucrative project that failed against some standard of ours. That was one of the blessings that lent us courage to forge ahead, resolved to our ideals. The payoff today is that we enter 2010 with no shame in our practice and no compromise in our standards.

Despite the decline in client projects, we never once failed to meet payroll or maintain profitability. Luck favors the prepared.

Developing a stronger unit

Not everyone sits idle through a recession. Winners are working to gain strength even in lean times, and so that’s what we aimed to do. Throughout the year and especially during the periods of diminished client work, we took on internal projects that challenged both our design chops and our development abilities. We let our eyes get bigger than our stomachs. We let our reach momentarily exceed our grasp. There was much to which we aspired with these projects that we simply didn’t have the know-how to accomplish. We took several seeming risks, but for us the outcomes and the benefits were never in doubt.

The result of all of this aspirational activity is that along the way our team learned new skills, developed more breadth and depth of ability, and we gained valuable experience and insight into important processes. In short, our folks bit off the tough meat; we invested time, effort, and money into working through the challenges, and emerged stronger for it.

From design agency to product retailer

We launched Unify in August of 2009. This immediately placed us into a couple of new business categories: product retailer & customer service organization (oh, and we design and develop websites, logos, and user experiences, too). Both are cumbersome hats to wear, but we knew what we were getting into.

Our staff includes those who have significant retail and customer service experience, so we had a fundamental base from which to draw in our new roles. That—coupled with an unwavering enthusiasm and belief in the product—made the launch and all that came with it a far less daunting prospect.

For us, the whole Unify development process and launch fit right into what had become our mantra for 2009 (“we refuse”) because it represented doing things some would find too risky or dangerous during a recession. Namely, we were taking time away from lucrative work for clients to produce and launch a retail product when many folks—our potential customers—had less and less to spend. Furthermore, the product itself was meant to help our industry peers to provide a service that we ourselves offer. This effectively made it easier for other designers to compete with us. But as we stated in the article, we refuse to participate in a fear-driven, cannibalistic market. We’re in the habit of collaborating with our peers rather than stealing from them, and working to support and grow our profession rather than trumping it. With our approach we’re defining our own market. We like it best that way.

Rounding out the year

Continuing our internal project and overreaching trend, we initiated two more fun projects late in the year. First we collectively produced 14 mini-projects for our client Advent calendar. This was our holiday gift to our clients; where they could visit each day in December and find a new freebie or game or just something to bring a smile to their faces. Some might consider this to be a frivolous waste of time and resources. We found it to be a joy.

Very late in the year we seized upon the idea to create a site where people could trumpet the nice things other people had done for them. We spent the last couple of months of 2009 conceptualizing, designing, and developing JustMadeMyDay.com (which launched in early January, 2010). It was a process that demanded that we learn from scratch how to do just about everything that the site had to do functionally. We were happy with the process and thrilled with the results. Thankfully, so are a lot of other folks.

So…not to put too fine a point on it, that was our year. We grew in all sorts of ways during a lean economic period and we’re now better equipped and prepared to meet the challenges of the coming recovery. We’re evolving in interesting directions these days and excited about all of them. We’re blessed with excellent clients, wonderful friends (many of them are clients!), and a terrific team that fits together perfectly. As for 2010: Bring it on.

See the Graphic Report »

Sewanee Environmental Institute

Tuesday, February 2nd, 2010


We’re excited to announce the launch of the Sewanee Environmental Institute this week. This was the first project that we did with Sewanee: The University of the South (and we liked each other so much we’ve done 2 more projects since—coming soon). Here’s the SEI case study.

Sewanee has a magnificent campus and a 13,000 acre domain to surround it, on and around the Cumberland Plateau in Tennessee. That setting is ideal for an environmental institute and SEI was created to take full advantage of the domain as well as the scientific and academic capacity of the university. SEI is groomed to be the most consequential environmental research institute in the South.

We had a wonderful time at Sewanee and we are thrilled to see our design realized for the institute, thanks to the fine development efforts of John Rogerson, Director of Web and Digital Communications at the university (who also managed the project on the university side). The SEI staff, university administration, and the university’s Office of Communications and Marketing staff have all been a joy to work with. We can’t wait until the next project launch!

Projects to Kick Off 2010

Thursday, January 14th, 2010

After a nice long holiday break with our families, the Unit Interactive team is back at work on some cool projects. Some notable items in the 2010 hopper include:
Unit Interactive in 2010
Unify
After an interesting start (more on that in a later post) our simple content editor, Unify, is cranking right along and we’ve been very pleased with the adoption among designers and developers. Now roughly 4 months in, Unify has been much improved from the initial release and is currently in v1.1.5. We accomplished our primary launch aims and it’s time to pay some due attention to our favorite app. We’re working on updated information and a new design for the Unify website (getting away from the Unit Interactive website clone), which we plan to launch sometime near the end of this month.

JustMadeMyDay.com
Just Made My Day is a new project for us that we decided to do just because. Mostly, it’s a continuation of our effort to help make the web a happier place. It also comes with the added benefit of allowing us to flex our UX and backend development muscles in a fun and happy way. We’re looking to add features and media integration on a continuing basis, but mostly we’ll see where this goes according to where the public takes it. Hope you enjoy!

Woot
We’re now in our third calendar year of work for Woot and every week of it has been great. We’ve worked with them on developing pie-in-the-sky ideas, we’ve brainstormed new directions and features, and we’ve designed and developed the ongoing flood of required new properties, features, and pages. Notable items include the re-imagined Shirt.woot reckoning, the Kids.woot site, and their newest property Deals.woot. Work continues each week as we address new things and refine the details of the Woot user experience with the great team at Woot Workshop.

Brickyard Partners
We’re very happy to be continuing our collaborations with Howard Mann of Brickyard Partners in 2010. After the recent launch of the Ivey Institute for Entrepreneurship, the Brickyard Partners blog, and others, we’re already hard at work on the next of what we hope is a succession of new projects with BP.

Vector Media Group
We’ve been working with the guys at Vector Media Group for quite a while now and have enjoyed every minute of it. Having worked with them on two of their internal projects (including redesigning their website) and a handful of collaborative efforts for other clients, we’re again working with them on their own brand.

Sewanee: The University of the South
After our initial project with Sewanee (which we’re excited to say will be launching in February), we were enlisted to redesign two of the primary components of the university’s web presence. Details in the near future.

And more…
In addition to these we’re working on other projects that will soon see the light of day. It’s fun and busy times around the Unit offices these days and we’re having a great time. We’re looking forward to a wonderful 2010. Hope you are, too!

The Sum of All Choices

Thursday, December 10th, 2009

At the agency where I was first hired, web projects when I started there were stiffly broken up into silos of expertise. The sales staff booked the projects, the project manager and designer(s) did the discovery process, the designer(s) crafted the design comps, the comps were handed over to a developer for “slicing” and html (very little CSS if any) and programming, and the CTO launched the projects. Seldom if ever did any of these people intermingle or even converse in a project and the only person who communicated with the client (outside of a discovery meeting) was the project manager.

Over the next couple of years Angela and I (we both worked there) worked hard to break down those walls, amend and repair procedures, and create a better project process that more properly involved and integrated the folks working on projects. Details aside, we basically worked toward the ideals referenced in Karri Ojanen’s excellent piece over at the Threeminds blog. With the thesis: “separate the problems and you’ll mess up the solution” the essay is astute. The part I like best is…

“…The danger is that we separate ourselves from our audience. Because when the audience looks at the campaign we’ve built, the process we’ve engineered on a website or in a mobile app, or the social networking components we’ve brought into a digital billboard ad, the audience doesn’t consume the pieces of the design and the functionality separately. They get the total experience: the sum of all the choices we’ve made in strategy, in tactics, in visual design, copy and code.”

Karri is talking about everything involved in a marketing campaign, but the principles still hold when you narrow the scope to a simple web project. Integration of all the expertise and resources results in a stronger result. This is the way we work here at Unit and the way we work with our strategic partners.

My concept of design is that it is a holistic endeavor; important to every aspect of business and strategic aims. Surely this idea works the other way, too. At least that’s the functional assumption behind integration of all resources on a project. Anyway, so I have the same question that Karri did at the end of her essay:

How do you facilitate inter-disciplinary work?

SnowCraft Fun!

Friday, December 4th, 2009

SnowCraft

Give yourself a fun break today and play a few games of SnowCraft. It’s a lot of fun and harder than it looks. Successive levels present a challenge for anyone of any gaming skill. Gotta love the holidays!

via

Risky Wallpapers

Wednesday, November 18th, 2009

Risk is too much maligned in our (western) culture these days and that has begun to seriously piss me off. It wasn’t always so. The west, the US in particular, used to be a place where risktaking was understood to be a fundamental component of life; successful life especially. A life free from risk is a life bereft of liberty, a life of bondage. This fact has never and will never change, but an increasing proportion of our lives is being restructured in a foolish effort to remove risk. The dauntless spirit of the West is becoming increasingly daunted. I put it to you that this is a dangerous path and that the results will be disastrous.

So this morning, in a fit of indignation, I started writing a bunch of maxims, riffing on the concept of taking bold risks. The results were soon translated into 6 desktop wallpapers and I thought I’d share them. If you’re anything like me and you recognize the fundamental value of taking bold risks, you might slap one of these babies on your screen. Please enjoy.

Risk

The “Risk” Wallpaper Collection

Recommended
Most Popular
Underappreciated