http://ericmillerdesign.com/blog/post/ en eric@ericmillerdesign.com Copyright 2010 2010-08-03T14:45:58+00:00 http://ericmillerdesign.com/blog/post/billings_case_study_on_eric_miller_design http://ericmillerdesign.com/index.php/site/billings_case_study_on_eric_miller_design/#When:14:45:58Z Marketcircle, creators of the popular time tracking and invoicing application Billings, recently interviewed Eric about how we use their software to improve our business. Billings is an excellent software package that allows us to keep track of time worked on projects and easily send invoices and estimates, all within a user-friendly interface. Read the full interview at Marketcircle. News, In the Press, Design Business 2010-08-03T14:45:58+00:00 http://ericmillerdesign.com/blog/post/the_design_of_bmi_mobile http://ericmillerdesign.com/index.php/site/the_design_of_bmi_mobile/#When:11:47:12Z We are excited to announce the launch of the mobile version of the BMI website. While we have optimized websites for display on the iPhone and other devices in the past, this is the first truly mobile version of a site that we have worked on. Eric Miller Design handled the interface design, and some project planning along with the people at BMI and Mokolabs, who handled the development. The site is optimized for iPhone, Android, Palm, Symbian and the upcoming Blackberry 6.0 phones, so if you’ve got one, head over to bmi.com to check it out. Along with the mobile design, we created graphics to promote the launch on the website and in print. Read the official press release on bmi.com. Thanks to Glyphish for the beautiful icons. The mobile home page and main menu. A MusicWorld feature and the video main page on BMI mobile. Promo graphic to announce the launch on the BMI home page. Graphic created for use in the printed press release. Our Projects, ExpressionEngine, Design 2010-06-03T11:47:12+00:00 http://ericmillerdesign.com/blog/post/eric_miller_design_featured_on_37signals_blog http://ericmillerdesign.com/index.php/site/eric_miller_design_featured_on_37signals_blog/#When:13:06:06Z 37signals, the company behind popular web-based applications such as Basecamp, recently interviewed Eric about how Highrise is used to manage many aspects of Eric Miller Design. Highrise is a CRM that we use to organize contacts, tasks, our schedule and project leads. Read the full interview at 37signals. After the article was posted, we were also featured in the 37signals newsletter. News, In the Press, Design Business 2010-05-18T13:06:06+00:00 http://ericmillerdesign.com/blog/post/our_new_business_cards http://ericmillerdesign.com/index.php/site/our_new_business_cards/#When:22:38:16Z Our new business cards arrived today, featuring our shiny new logo. The cards use the typeface Museo Sans by Jos Buivenga, in its original form on one side and handwritten on the other. The content on both sides of the card is identical, with the back being reversed to show the layer beneath the final version; the sketch of the card concept. I used a Wacom tablet to sketch the mockup side into Photoshop. Our Projects, Design 2010-04-21T22:38:16+00:00 http://ericmillerdesign.com/blog/post/the_client_is_always_right http://ericmillerdesign.com/index.php/site/the_client_is_always_right/#When:02:34:27Z This weekend, I’ll be heading to Baltimore to speak at (and attend) the city’s first design conference, A Day in the Life. My session, The Client is Always Right, is all about approaching clients in a professional manner and keeping your high level of design within the means of what a client is looking for. I’m excited to get a discussion going on this common topic of debate among designers. I’ll be talking about specific scenarios along with big picture topics that all affect the results of your design conversations with clients. These include relationships, customer service, how to talk about design work, taking criticism, choosing clients and mistakes designers make. Will you be there? Say hi in the comments and I’ll see you there. Are you attending my session? Say hi and feel free to include a client situation you had no idea how to deal with! I’ll be tweeting from the event if you want to follow me. I’m looking forward to checking out MICA, meeting the other speakers and attendees, catching a session or two and doing a little exploring of the city. News 2010-04-21T02:34:27+00:00 http://ericmillerdesign.com/blog/post/eric_miller_design_selected_as_official_honoree_in_2010_webby_awards http://ericmillerdesign.com/index.php/site/eric_miller_design_selected_as_official_honoree_in_2010_webby_awards/#When:13:56:04Z My personal website, myterritory.com, has been selected as an Official Honoree in the Webby Awards “Personal Blog/Website” category. Of the nearly 10,000 entries submitted to the 14th Annual Webby Awards, fewer than 15% were distinguished as an Official Honoree. My Territory was nominated for a Webby in the same category two years ago, so I’m excited to see the continued success of the site for an award that the New York Times calls “the Internet’s highest honor.” My Territory is an ExpressionEngine-powered photography site that allows visitors to browse over 10 years of my digital photo collection based on people, places and events. Read more about the site in the ExpressionEngine showcase interview. News, Our Projects 2010-04-13T13:56:04+00:00 http://ericmillerdesign.com/blog/post/devotee_features_eric_miller_design_and_our_work_with_bmi http://ericmillerdesign.com/index.php/site/devotee_features_eric_miller_design_and_our_work_with_bmi/#When:16:50:11Z Devot:ee is dedicated to all things ExpressionEngine, and they are currently featuring our design and development work for BMI.com. Their “Spotlight” articles “give designers, developers, add-on creators, and just generally great members of the ExpressionEngine community a chance to talk about how they have used EE and its add-ons in their work.” The interview focuses on the features of BMI.com, and the ExpressionEngine add-ons that help power the site. Read the Interview Devot:ee has since asked us for a follow-up interview with reader questions, so more to come. News, Our Projects, ExpressionEngine, In the Press 2010-03-24T16:50:11+00:00 http://ericmillerdesign.com/blog/post/how_to_integrate_slideshowpro_photo_galleries_with_expressionengine http://ericmillerdesign.com/index.php/site/how_to_integrate_slideshowpro_photo_galleries_with_expressionengine/#When:22:15:00Z We’ve spent a good deal of time figuring out our current solution for integrating SlideShowPro (SSP) flash photo galleries with our favorite content management system ExpressionEngine (EE). If you are not already familiar with SlideShowPro, it is a Flash photo gallery component that reads XML files containing the list of images to display, with options such as transition effects, full screen mode, navigation styles and many others. In this solution, a single EE weblog entry (not in the photo gallery module) is used for each photo. One Flash file is used to generate multiply galleries, and these galleries are created based on photos with matching categories or content within an EE field, such as an event name or tag. How It Works Before going through the steps, here’s the basic idea. The end result allows you to insert the following code in a template or entry to generate a gallery of photos that share the same EE category: That embeds the flash gallery and passes a category variable. The flash code grabs the category variable and calls an EE XML template. The XML template uses that category to generate a list of photos within the category. The SWF file reads the newly generated XML and displays the photos. We’ll then modify this to generate a gallery based on matching field content. Please note that while this method uses SlideShowPro, it could be modified to work with a non-flash HTML5/CSS3 gallery, and we’ll be working on that next. How To Do It Step 1: Create Your Flash File Create a flash file and insert the SlideShowPro component on the stage. Click on the component on your stage and give it an instance name; we will use “ssp” for this tutorial. While the default method of calling an XML file is by putting the path in the component inspector, instead we will use some ActionScript to call an XML file (which will actually be an EE template) from the flash embed code. In the first frame of a blank layer in Flash, insert the following ActionScript. Note the use of “ssp” referring to your instance name of SlideShowPro: Export your flash file and upload the SWF to your server. We’ll come back to it later. Step 2: Create a Flash Embed Template First, we’ll look at the method for creating a gallery of photos that share the same category. In EE, create a template that will contain your flash embed code, avoiding the need to always include the full flash embed code in a template or entry. For this tutorial, we’ll create an EE template group called “photos” and name this particular template “category.” In template preferences, choose “Yes” under “Allow PHP?” and “Input” under “PHP Parsing Stage.” In the template, use your favorite method of embedding a Flash file (several options are available in the SSP documentation) and reference the SWF you uploaded in step 1. We’ll add a couple of modifications from there. Add the following PHP code to the top of your template: Then, we need to add the flashvar to the Flash embed to call the XML template (that we’ll create in step 3) and pass the variable again. Depending on your method of embedding the flash, this exact code may differ, but the var is the same: So, with those two code snippets, we first embedded the variable “cat” and named it “cat_num,” and then passed it to the XML and renamed it “cat” again. You can use any variable names you like. Step 3: Create the XML Template Within your new “photos” template group, create a template (of type “XML”) named “xml_category.” This is the template we called in step 2. Again, choose “Yes” under “Allow PHP?” and “Input” under “PHP Parsing Stage” in the template preferences. Insert the following code in the template: So in the top of this template we have the PHP and EE code to grab the variable. We request “cat” from step 2, and assign it the name “cat_value.” We then use a standard EE “assign_variable” tag to take “cat_value” and assign it the name “cat_num.” Following that code are the opening “gallery” and “album” tags for the SSP XML. Your id, title, and description can vary. Then we have the EE code that generates the list of photos. In the opening weblog:entries tag, we call the weblog “photos” (which you’ll create next) and for the category, our variable “cat_num.” You can use any additional parameters in the opening tag, such as orderby, sort, limit, etc to define what is displayed in the photo gallery. Following that is our img tag, that will repeat for each photo within the category. Here, we are using the EE ImageSizer plugin to generate the small and full screen versions for the Flash, but you could replace this with standard image tags, as long as you keep the “photo_path” EE field as the image source. Using ImageSizer, we are generating a 500 pixel version for the standard gallery and a 1024 version for the full screen gallery. We are then adding a photo caption, link to a detail page so you can have permalinks for photos, and a target for that link, which are all optional. Finally, we close the weblog:entries, album and gallery tags. Step 4: Create the Weblog Now we need a weblog and some entries so we have photos for the gallery. Create a weblog named “photos” and the custom fields we referenced in the XML template. These were “photo_path” and the optional “photo_caption.” Also create a field for an event title or keyword (we’ll call it “photo_event”) if you want to modify this method later to create a gallery based on field content. Finally, create some categories and assign them to the weblog. Now, you can publish some entries within the photos weblog. In the photo_path field, include the path only (not a full image tag) to your image when using the photo upload tool. Make sure to create at least a few entries with the same category applied to test this method. Step 5: Create a Gallery We can now embed our flash in a template or entry to generate a gallery. Use the code we first looked at in the intro of this tutorial: Note: If you are using this code within entries, you will need to use the EE Allow EE Code plugin that allows for EE tags within entries. Even with that solution, you will have to see how EE renders the embed which can potentially break depending on your field formatting options. Alternatively, you can skip this embed and embed the flash code directly, including the category number in the flash var instead of the PHP variable, like so: That’s it! You can now create category-based galleries on the fly. Step 6: Modify to Use with EE Fields (Optional) This method can also be modified to match content within an EE field instead of a category. For example, you can create a gallery of all photos where the event=“My Birthday” or a tag field contains “birthday.” You can of course just use this or the category solution, but I prefer having both available. We can use the same flash file, but need an additional flash embed template and XML template. Using the same basic settings and code from the category model, create a template for the flash code called “event.” Replace the PHP code at the top with: Replace the flash var with: Create an XML template called “xml_event” with the following code: We’re using the same method of passing the variable, but instead doing a search on the field “photo_event.” So in a few of your weblog entries, in the field photo_event, add a matching event name such as “My Birthday.” Now we can embed an event gallery: If you’d rather match a keyword or tag within an EE field, instead of an exact event name, you can use this method with a slight modification. Change your variables to reflect a tag and add an EE field for tags. Then, when you do the search in the weblog:entries call in the XML template, change the code to: You can modify the search as necessary following the EE user guide for the search parameter. While it takes some set up, you are now ready to create custom galleries based on categories, matching event titles or keywords by inserting a single line of code. What’s Next? Next, we will modify this to work with an HTML5/CSS3 gallery, and create a method to import a bunch of photos at once using Solspace’s Importer module. It’d be great if you’d share any modifications and uses of this method in the comments. Thanks! ExpressionEngine 2010-03-16T22:15:00+00:00 http://ericmillerdesign.com/blog/post/bmi_event_promos http://ericmillerdesign.com/index.php/site/bmi_event_promos/#When:18:29:31Z We’ve been having fun lately designing banners for the BMI.com home page to promote their events, including a Cheap Trick showcase at SXSW, the Sundance Film Festival and the Grammy Awards. Since these aren’t generally in the portfolio we thought we’d post some here. Our Projects, Design 2010-03-15T18:29:31+00:00 http://ericmillerdesign.com/blog/post/my_open_windows http://ericmillerdesign.com/index.php/site/my_open_windows/#When:18:16:42Z Based on Michael Lebowitz’s post on his open browser windows and apps, here’s what I currently have waiting in my browser tabs and open in my dock. I decided to do this when I realized I had a bunch of unread windows minimized and waiting. Browser Tabs My Highrise account Ork Posters, Brooklyn version A flash upload tool I’m researching for a project Hyperakt’s Behind the Scenes of their NAACP Annual Report Design Champagne - Campaign Monitor Module for ExpressionEngine Snipt Posterous (finally considering setting up an account) MicroTut: Centering a Div Both Horizontally And Vertically 15 Fresh Logo Design Processes That Teach Volumes The about.com graphic designers directory (that I maintain) Apps Safari Photoshop Flash Transmit BBEdit iTunes (next up, new Gorillaz album) Billings Tweetie Design Business 2010-03-11T18:16:42+00:00