I spent part of last week participating in the D2W (Designer to Developer) conference in Kansas City. This was the second year the conference has been offered. Many thanks to @DeeSadler for her efforts in making this conference a reality. There were 38 speakers this year. It is a huge effort to pull everything together for a conference. I was particularly impressed with the lineup of speakers. Dee – you did a great job pulling in so many talented individuals for the conference. Thanks also to Chad Udell (@visualrinse) and Matt Forcum (@robotbeach) for the ride to the conference and back. We had some great conversations. I do hope we continue to exchange information in the future.
I spent most of my time in the mobile track (gathering notes for classes I will be teaching this fall). Note to students – if your teachers are not attending conferences every year (and are teaching web technologies beyond the fundamentals), you are probably getting stale information. [Demand better.] I never cease to be amazed at how quickly things change. Just a small case in point – it now appears the actual number of cell phones exceeds the number of toothbrushes on this planet. I could only find one link to confirm this (so it may not be true). However, the fact that cell phones are becoming almost ubiquitous means we need to spend greater emphasis using them in our teaching. I am trying to stay on top (ok, the operative word is trying) of what is happening in the world of mobile/ multi-screen as it relates to web technologies. This was the main reason I spent my time and personal funds to participate in this conference.
Here are the sessions I attended (along with a few notes). I also include some final thoughts at the end of these notes.
Keynote on Workflow – Paul Trani – Paul spent the majority of his talk focusing on the improvements in a number of Adobe products to help expedite processes and improve workflows. Some of the products mentioned included InDesign, Flash, Flash Builder and Wallaby. Paul also demonstrated a Flash application running on a Android device that was communicating with an iPad, Android tablet (Xoom) and PlayBook. He also showed how one could debug directly on the device and send trace statements back to the mothership (laptop in this case). This was quite an impressive demonstration of the capabilities of Flash Professional 5.5.
Is mobile for me? What skills do I need? – Chad Udell – Chad focused on the personal traits (not tools) necessary to be successful in this space. His main thesis was that workflows are changing and we need to adjust our skill sets to meet many new challenges. However, we have done this before (successfully). For example, many of us have been involved in changes from local applications and networks to the World Wide Web. We next made a successful transition to content management systems and then to rich Internet applications and so forth. Mobile is just the next step in the evolution of many technologies. Chad stressed the mindset and skills you need to be successful in this environment. This includes:
- ability to self teach,
- desire to learn (and keep up to date),
- an open mind (we sometimes need to unlearn and relearn),
- creativity,
- agility,
- decisiveness,
- flexibility,
- pragmatism,
- patience (and good time management skills),
- a thick skin (other will critique your efforts),
- and a willingness to spend money (one needs to obtain actual devices to test upon).
Adapting expectations to fit a mobile work flow – Joseph Labrecque – Developing for mobile is a double edged sword. It can be very frustrating due to the plethora of devices, screen sizes, resolution, processors and so forth. It can also be very exciting and challenging. The rate of change is also amazing. This is part of what keeps it so interesting. Joseph also spent a fair amount of time reviewing the Denver University Course Media application he helped develop. He focused on issues such as work flow, expectations and design. Make certain you design for fingers in the mobile world (and don’t forget that finger placement can obscure content). Also, don’t forget to take into consideration the type of device being used. For example, Android phone visitors have somewhat different user interface from BlackBerry PlayBook users (for the latter, you access a sub-menu by swiping the top bezel downward). It is important to test on actual devices. One also needs to know their target audience and the age of mobile devices being used.
jQuery Mobile: learning from my mistakes – JP Revel -JP spent a fair amount of time reviewing the fundamentals of jQuery mobile. He also discussed other frameworks (like jQuery and Sencha Touch). Regarding jQuery mobile, JP covered the fundamentals of gestures, events, and themes. He also discussed the XHTML mobile DTD as an alternative to HTML5 for now. The majority of this talk focused on demos and code snippets.
Apps vs. Sites vs. Content – A vendor agnostic view on building stuff for the mobile web – Kai Koenig – Insight – U.S. is way behind the curve in terms of mobile. Many people in Asia have been using better and faster networks for some time. If you really want to focus on application growth markets, consider China and India. Kai discussed “the web is dead” article published on Wired Magazine recently as well as mentioning that mobile is the new standard to design for initially. He then spent some time reviewing various development alternatives. For example, one can go “native” for various environments (such as Objective-C for Apple iOS, Java for Android, C++, Java or Python for Symbian, Visual Studio for Windows Phone 7, Java for RIM). One can also develop web sites as an alternative to developing apps for each platform. One can place an emphasis on HTML, CSS, and JavaScript. There are lots of libraries (such as jqTouch, jQuery Mobile, Sencha and so forth). WebKit is the main browser engine to target (along with use of local storage and geo location for the websites). Flash/ AIR is another alternative (as is Titanium). Although PhoneGap doesn’t compile to native code, one can still use it to develop applications based on HTML, CSS, and JavaScript. What to build, who to target, and where to target are the big issues. Making money is also an issue. Unless you are one of the top 5 apps in a given market, the average price for your app may well be less than $1. You should also be aware of revenue sharing and legal issues in the appropriate market. For example, if the app is pulled from a market, you must refund money to the buyers.
10 minute Android app using Flash CS 5 – Rob Huddleston – Rob wanted to show something somewhat practical (instead of a simple “hello world” application. He is a user group manager and decided to develop an application to pick a random winner of a prize. Rob spent some time first showing that he could build the app in less than 10 minutes. He then reviewed the code and discussed best practices in creating the app. For those who are wondering, yes, I also followed along and built an app I plan to use at our next user group meeting. Rob then discussed deployment and options for Android devices. This includes versions, having a unique name, orientation (portrait or landscape), whether to use full screen or not and so forth. He also demonstrated how to debug directly on the application. Rob also discussed deployment of these applications.
Automated workflows – Jesse Freeman – Jesse provided an inspirational talk stressing several key points. First – most of us are lazy (it seems to be a way of life). Take advantage of this and automate. Otherwise, we will make mistakes doing repetitive tasks. We should stop making mistakes. However, it is possible “your only purpose in life is to serve as a warning to others!” Don’t forget the main emphasis of any project – time, quality and money. You can have any two. We must employ automation. Identify patterns (for example in preparation of assets) and employ automation (such as Photoshop scripting) to help avoid mistakes. When working with a project, first develop conventions for initial setup. Then document these. Write out all the steps in a readme file. Where possible, re-use code and consider employing frameworks (if appropriate – often, they are not). Don’t forget that automation is an art form. You must find your own path as you practice your craft.
Wireframing/ prototyping for mobile using Fireworks – Jim Babbage – Jim stressed the fundamental reason to use Fireworks – save time (and time = money). If you save time, you can move on to other things. Jim covered building prototypes for mobile using Fireworks. However, he also adjusted his presentation to the needs of the audience. Since a fair number had not used Fireworks extensively, he spent time covering the basics. He stressed that one will save time, but that one should spend time learning the product before employing it on a project (with a deadline). That only leads to stress.
Developing compelling mobile user experiences – Chris Griffith – Although many metrics point to designing for mobile first, building mobile apps is hard (lots of different technologies and design considerations). We are dealing with a different set of users (bored and fickle). Many people download an app, try it one or two times, and delete it. If you make it past this, people often have fanatical loyalty to a given app. People want simplicity and ease of use. They want to play, learn, and communicate. However, this is a different medium. For example, touch is involved (but your fingers are connected to your hand and may well obscure some content). Don’t forget that in this medium, there is limited time, limited attention, limited pixels, limited processing power, and limited connectivity. What is the key problem you are trying to solve. What is the “home run” task? That is what you need to design and build. Chris also discussed a number of mobile design patterns. These include:
- flat cards – biggest advantages are quick and focused content, low chrome involved. Biggest disadvantages include traversing from start to end of stack and scaling the number of cards.
- tab/ nav bars – biggest advantages are easy access to main features and easy overview of content and features. Biggest disadvantages include the fact that tabs are always present and take up a significant amount of available real estate.
- list tree – biggest advantages are that these scale past 5 items and one can have direct interactions. Biggest disadvantages include that visitors must remember their navigation path and must return to the top node to access another branch.
- dashboard – biggest advantages include revealing capabilities of the app and offering shortcuts to key sections. Biggest disadvantage includes having return navigation appear as a mystery.
Don’t forget that people judge an app by its cover. He included this image as an example.
Media queries: mobile elixir or CSS snake oil? – James Williamson – Although there may be some fear, we can’t ignore mobile any longer. Yes, but we just got Internet Explorer to behave and now there are so many new devices (and interfaces). James began by reviewing media query syntax. He then proposed a new approach – load the mobile CSS first and progressively enhance to other platforms (as needed). Otherwise, all the code (CSS and JS will be loaded for small mobile devices). Load all the styles in one document using @media syntax (like @import) and pull in mobile first, then tablet, then desktop. He also discussed the <meta> attribute viewport and mentioned that media queries should alway be used in combination with this.
HTML5: the continuing saga – Seb Lee-Desisle – Seb began by mentioning that 5 years aso, if we wanted anything beyond core functionality on a web page we had to employ technologies like Flash. Now there are so many alternatives. He indicated that he is seeing a decline in jobs requiring Flash (at least in New York area). He reminded us it is always important to keep investigating alternate technologies. The majority of his talk relied on using real time Twitter feeds from the audience to post questions which Seb then answered. Much of the discussion focused on alternatives such as Corona and Unity.
Using jQuery mobile for your next web application – Andy Matthews – Andy began with a review of the capabilities of jQuery Mobile and which platforms have support. He then delved into the fundamentals of creating a simple application using this technology. He provided code snippets so we could follow along. Essentially we were reviewing the D2W mobile app he developed for the conference (including speaker notes and so forth). He showed how we could employ additional CSS for progressive enhancement. He also reviewed themes and customization of themes. He also reviewed events and how they are handled.
Making WordPress bend to your will – Tom Jenkins – Tom reviewed a number of sites he has created using WordPress as the base system and then reviewed how one can use the various APIs to make necessary changes to the platform. He started with a review of themes and plug-ins and expanded into template tags. Emphasis was placed on add_filter and add_action. He also reviewed the fundamentals of creating your own widgets and plug-ins.
FW to DW to Flash to Catalyst – Tom Green and Jim Babbage – this final session reviewed creating a site for a theoretical client who is trying to sell tours to the spots where Jim and Tom go camping every summer. They discussed basic workflow and how to bend the tools to accomplish the task at hand. FXP file format was used as principal means of exchanging data between applications. It took them roughly 3 hours to complete a prototype site and the rest of their time was then spent on making it look more professional. Good overview of work flows involved.
Summary and insights gained from conference – Was the trip to Kansas City and 3 days of my time (and personal funds for meals and the hotel) worth it? Definitely. Not only was I able to network with a number of colleagues I have known for many years, I also met a number of new people and established many new contacts. After all, networking is primarily the reason I attend such events. I also learned a great deal more about the mobile environment. This is changing incredibly rapidly and it is tough to keep on top. I do find myself relying on tools like Twitter to learn the latest bits of information (and I was able to add a number of new individuals to follow). I obtained a number of insights about mobile development – especially the use of @media to pull in mobile, then tablet, then desktop CSS as needed. I also learned a lot about workflow and characteristics to succeed in this emerging environment. I received confirmation that the US is significantly behind other parts of the world in this space and we are trying to rapidly catch up. I believe I have a number of nuggets of useful information which I can convert into materials for use in my classes this fall (particularly the new class dealing with multi-screen). Thanks again to Dee Sadler for pulling all this together. Great conference.
Loading ...
