• Home
  • About
  • 27.03 MobileTech2012 Day 2: UI Design Prototyping

    March 27th, 2012

    “Prototypen im UI-Design” from Werner Jainek (Cultured Code)

    Werner comments that books on UI design don’t emphasise the design process.

    The Things app won Apple Design award.

    Key points:
    - Communication/interaction with the user
    - Iteration: required to move from vage ideas to something useful

    Werner correctly observes that programming the UI in order to get user feedback is expensive. This is especially true of iOS apps. In prototyping, just as important as time-savingis the avoidance of concern with irrelevant details. Prototying enables you to focus on the “essential”. Therefore: Start with paper prototying.

    Trade-off example: Safari on iPad: Use tabs (quicker) or use the “desktop” (more intuitive) metaphor? iOS5 moved to tabs.

    Werner describes some of the iterations that the Things app went through.

    Interesting is that the ideas – from iteration to iteration – are actually quite different. It’s important not to be afraid to throw away stuff that doesn’t work.

    Be aware, Werner says, that the 80/20 rule doesn’t always work. The rule being: If 80% want the feature it’s in; otherwise, don’t bother. You need to be aware of who the 100% is. Finalcut: The 100% is the movie editing professionals – or at least those that want to edit professionaly. Here is not appropriate to exclude features because they’re not required by 20%.

    Now Werner takes up through several aspects of the iterations, which were experienced during the development of the Things app.


    27.03: MobileTech2012 Day 2 – Conference kick-off

    March 27th, 2012

    Introduction from Sebastian Meyen, Chief Content Officer of the conference.

    States the main theme of the conference. Roughly: “The mobile revolution is over. Now we’re in the middle of a “mobile transformation”. Why? Because the expectations of today are that Mobile services deliver real substance and business value; forthermore, user-expectations have increased dramatically.”

    For example, app designs must address very specific use cases. Functionality must be focussed on this. There is no room for “ok” usability. Furthermore, technology must be performant, robust, secure.

    Next up: “Jetzt gibt’s auf die Ohren: Sound wird Mobile” with Maks Giordano

    Maks delivers a nice reminder how mobile voice has developed over the years. Lots of nostalgic pics previous generations of mobile devices. Maks reminds is that sound one of several factors important in the user-experience, the importance of which is being demonstrated by many recent apps.

    Next up: Manfred Lutzky of Fraunhofer IIS

    Frauenhofer responsible for Mp3 and AAC-ELD.

    Manfred talks about full-HD voice: Up to 20’000 hz, which means it sounds like you’re hearing the sound directly. AAC-ELD is a full-hd codec. Facetime (apparently) uses this.

    Interesting observation: Conventional phone or any sub-20’000hz audio quality relies on the human brain’s capacity to compensate for ambiguities resulting from the information loss. This requires an effort – even if subconscious – to process. Improving sound quality therefore improves the user-experience in a very profound way.

    Next up: Philipp Eibach of wahwah.fm Nunatak

    Presents wah-wah fm. Philipp critices the modern music experience: It has isolated listeners from one another. The Wah-wah app enables different parties to hear the same music at the same moment. It’s a a kind of decentralised personal radio.

    Next up: Michael Breidenbrücker of Reality Jockey Ltd.

    Michael describes the mobile device as music platform as opposed to player. Cool demo: Uses his iPhone as a mixing desk by rotating, shaking it etc. In “jogging mode” the beats adapt to the rhythm with which the device is being bounced. Very nice! Reality Jockey worked on one aspect of the “Inception” app – an app based on the movie of the same name.

    The central concept is to adjust the music to the environment in realtime.

    Michael describes how some early concepts arose before the social Internet wave. But it turned out that was too early. The culture changed and now the kind of experience this app offers matches user-expectations perfectly.

    All in all: This was a great kick-off for the conference. Inspiring ideas and concepts. A great mix of academia and coolness!


    iOS Talk: Recipes for non-trivial Core Data apps

    February 29th, 2012

    Am 26. März geht es mit der MobileTech 2012 in München los. Der Vortrag, den ich halten werde heisst “Recipes for non-trivial Core Data apps”. Ich freue mich schon auf de Gelegenheit, andere Mobile Entwickler kennen zu lernen, erwarte auch von den vielen interessanten Sessions zu profitieren…

    Abstract
    Während für Unternehmen das Potenzial und Wichtigkeit von Mobile Apps immer klarer wird, steigern rapide die Ansprüche für Datenerfassung, -darstellung und -kommunikation. Eine nicht triviale Business-App auf Basis von Textfiles zu entwickeln ist längst keine Option mehr. Eine Datenbanktechnologie wie SQLite anzuwenden ist die zweitbeste Option, fordert aber den Umgang mit SQL und ein von Hand gestricktes Mapping zwischen Datenbank und Anwendungsobjekten. Anlässlich dieser Probleme fangen viele Entwickler optimistisch das Core Data API zu lernen – entdecken aber schnell, dass trotz “einfacher” Beispiele von Apple, Rezepte für den Umgang in realistischen Szenarien schwer zu finden sind. Dieser Vortrag präsentiert eine Reihe von erwiesenen, einfach anzuwendenden Techniken, wovon stark datengetriebenen Business-Apps profitieren können.


    Android Fragmentation

    November 24th, 2011


    The latest issue of the german Android360 magazine is featuring an article by our Android experts about fragmentation on the platform.

    Fragmentation on the Android platform comes in several flavors.
    Mobile devices in the wild can differ on their installed Android version, their screen size/resolution and their supported hardware features.
    With the advent of Android tablets the platform added a new class of supported hardware to its portfolio.
    The article summarizes the main does and don’t to tackle fragmentation successfully.

    If you are experiencing fragmentation problems in your Android project or want to avoid them upfront, talk to us. Our share-a-canooie service might be just the right thing for you.

    Remember: think Android, think Canoo


    Android and IDEA for the Eclipse Refugee

    October 18th, 2011

    Earlier this month I switched from writing my Android projects in Eclipse to writing them in IntelliJ IDEA. Overall the experience has been great, and I much prefer using IDEA to Eclipse for Android development. And now that IntelliJ IDEA 11 EAP (Early Access) has a visual layout window, there is almost no reason for me to write my Android apps in anything else. I wrote this post to help other users along their way when converting between the IDEs.

    Why IntelliJ IDEA for Android?

    There’s no need to ask why if IDEA is already your favorite IDE or if your company is forcing you to use it. But just in case you’re not already a raving fanboy, here are some of the features specific to Android that made me want to switch.

    Find usages (Alt+F7) is aware of Android XML resources (and the semantic meaning of their content), so searching across project assets is easier. Plus, I just find IDEA’s search capabilities a little saner than Eclipse’s. Below you can see what happens when I search from within my layout XML file for a certain widget ID:

    01. Find Usages

    Find Usages in IDEA

    Because IDEA knows about the Android XML resources, refactorings like Rename (Shift+F6) work across Java code and XML. You can rename a widget’s ID from the XML file and have the Java code updated, or rename from the Java code and have the XML updated. Here I am renaming a widget ID in XML. Nice. In general, I do not search within comments and Strings because it is a little too aggressive.

    02. Rename Refactor

    02. Rename Refactor

    There are several Android specific intentions that make life easier in IDEA. Intentions are the quick-fixes that are activated in Eclipse with Ctrl+1. In IDEA you use Alt+Enter. For example, if there is a static String referenced from your code then you should make that String a resource by moving it to strings.xml. Put your cursor into the String, press Alt+Enter, accept the name suggestion, and you’re ready to go. Ctrl+Z for undo on refactorings work great, too. One of the big differences between IDEA and Eclipse is refactoring support. In IDEA, the source files do not need to compile in order for refactorings to work. It is quite common to have a broken file and fix it through a couple automated renames or refactors.

    03. Move Refactor

    03. Move Refactor

    Finally, before IDEA 11, the killer feature for Eclipse Android was the visual editor for XML based layout files. Personally, I don’t often use drag and drop layout editors but I do value seeing my code changes immediately without recompiling and redeploying. Eclipse had the better feature set. But IDEA 11 now has a layout “Preview” mode. Make a change in the XML and see it immediately updated in the preview. You can also quickly change the theme, preview in landscape and portrait, switch to night mode, and select different screen sizes. If you absolutely need a visual editor, then Eclipse is the way to go. Otherwise, the Preview in IDEA 11 is good enough. More info available on the IDEA blog.

    04. Visual Preview

    04. Visual Preview

    Let’s get started with a tour of IDEA.

    Getting Oriented in IDEA

    The basic layout of IDEA is not all that different from Eclipse. You have a main code window (right, in image below), you have a Project View (upper left), and you have a Structure View (lower left). If there is a window for it in Eclipse, then there is probably a window for it in IDEA. A good way to get started and get familiar with IDEA is to read the DZone IDEA RefCard I wrote a few years ago. It is still relevant today. I highlighted the image to show the relevant details.

    05. Project View

    05. Project View

    At any time you can jump to the code window by pressing Escape, and you can close any open tool window with Shift+Escape. On thing that IDEA does not have is perspectives. Maybe you love Eclipse perspectives. Maybe you love when your code view shrinks up into a postage sized porthole whenever you launch a debugger. Who knows, perhaps this is useful to you somehow. I am trying very hard to be positive here, and the nicest thing I have to say about perspectives is that I hate them. Another thing IDEA does not have is a “Team Plugin”. There is no single “Team” abstraction that somehow fits on top of every version control system. Instead, when you enable Subversion then you use Subversion features. Git uses Git Features. Version control systems are enabled using the Tools->Enable Version Control menu item. Then the Alt+9 shortcut brings up the Version Control View.

    Running, Debugging, and the Android Tools

    Running and Debugging an application is slightly different in IDEA than in Eclipse. You manage your “Run Configurations” using your Run/Debug dropdown menu at the top of the screen:

    06. Run/Debug Configurations

    06. Run/Debug Configurations

    You can create temporary and permanent run configurations. Right clicking a test and choosing Run creates a temporary run config. If you want to run the target repeatedly then just save it so it is permanent. And you Maven users: you can right click a goal in the Maven view and create a run target, such as a run:jetty goal. The Maven support is amazing in IDEA, so you are actually lucky to be a Maven user in this case.

    The features of the debuggers are fairly close between the two products. Set a break point by clicking in the gutter (Ctrl+F8), select and right click a reference to add to the watch window. I’ve noticed that Eclipse users love to enable and disable breakpoints rather than just set and remove them. Well, you can press Ctrl+Shift+F8 to manage all your breakpoints if that’s the sort of thing you like to do. Also, notice the Logcat tab on the debugger, which shows you the Android log. If you are Running (and not debugging), then the Logcat output is in the “Android Logcat” view that you see on the bottom toolbar:

    07. Debug Window

    07. Debug Window

    The main Android Tools from the SDK are available under the Tools->Android menu. You can export a signed package this way and also launch the AVD to manage your emulators and environments. If you need the other SDK tools like “hierarchyviewer” or “monkeyrunner” then you’ll have to launch them from the command line. There is built-in Android testing support in IDEA, and when you run a unit test then the IDE will ask you whether to run it as a JUnit test or an Android test. It remembers your answer, so if you make a mistake then just delete the run configuration and start over. It will ask you again.

    Managing Your IDEA Project

    The two hardest parts of switching IDEs is Project configuration and Web Server configuration. Luckily we avoid the latter in an Android tutorial. But you still need to set up the project. First, some terminology. An “Eclipse Workspace” is an “IDEA Project”. An “Eclipse Project” is an “IDEA Module”. An Eclipse Workspace is composed of several projects. An IDEA Project is composed of several modules. If you have Eclipse project files then IDEA should be able to import them with no problems, and this is the fastest way to get started.

    The Project is configured using the File->Project Structure menu item. You can also open the window using the Ctrl+Alt+Shift+S shortcut, which I call the Paw Mash because holding your left hand like a bear paw and mashing the keyboard usually suffices to open the window. This is where you specify your source folders, your SDK version, and your dependencies. If there is no Project SDK selected in the dropdown list, or if the list shows an error, then click on the SDKs item in the left side pane to create a new one.

    08. Project Configuration

    08. Project Configuration

    Configure the modules by clicking the module entry on the left side. Here you can mark certain folders as source or as tests. By default, a fresh IDEA Android project has no “tests” folder, so you should add the folder and then come in here as mark it as Test Sources. You can also change some of the Android compiler settings by clicking the Android facet shown in the middle.

    09. Module Configuration

    09. Module Configuration

    One last thing to configure before leaving the window. If you are writing JUnit tests then you’ll need to add JUnit to your project dependencies. If you just annotate a method as @Test then IDEA prompts you to add the junit.jar to your classpath. The problem is that they add it as the last dependency, which causes the test to fail with the error “java.lang.RuntimeException: Stub!”. Come into this window and move JUnit up in the dependency list. Or configure Ivy/Maven/Whatever to do this automatically for you.

    10. Module Dependencies

    10. Module Dependencies

    That’s the quick tour of Project Structure… lets move on to Settings. Settings are the options not directly related to compiling the project. Things like code style, version control, plugins, and much more. Open Settings using File->Settings or use your Claw Attack to hit Ctrl+Alt+S. I call this shortcut the claw attack because if you pinch your left hand into an eagle claw and swoop it down on your keyboard then the Settings window usually opens right up. It helps to let out a mighty, “Ka-KAW” when you do it.

    There are thousands of settings in here. I heard the advice recently that new users of either IDE should spent a few hours just clicking around the settings page, and I honestly think that is pretty good advice. If you know what you’re looking for but can’t find it, then enter your search term in the upper left side search box and the settings list dynamically displays only those pages with matching entries. For instance, if you know you want to show line numbers, then type in Line or Line Numbers and click through the resulting pages. In this case, the highlighting you see in the image was created by IDEA and is used to point you to the correct setting.

    11. Settings Configuration

    11. Settings Configuration

    You most definitely want to change some of the default settings. Showing Line Numbers is under Editor->Appearance. Changing your tabs and space settings are done on a per-file type basis, and is accessed from Editor -> Code Style. By default IDEA allows you to place the cursor past the end of the line in a text file, and you turn this off under the Editor page. And Version Control is something you really must configure as well, which is under Version Control. GitHub integration in IDEA is tip-top and goes beyond just Git support, but lately I’ve been using and recommending BitBucket for free, private git hosting. In general I find myself using the IDE to make local commits and manage changelists, and the command line to perform pushes.

    Links

    That’s it! There are tons of ways to learn more, and here are my favorite links:

    As always, feel free to keep in touch by leaving a comment. You can read more from me on my blog at http://hamletdarcy.blogspot.com/, see my YouTube channel for more screencasts, and follow me on Twitter: @HamletDRC