• Share
  • Email
  • Embed
  • Like
  • Save
  • Private Content
FITC 2013 - The Technical Learning Curve
 

FITC 2013 - The Technical Learning Curve

on

  • 284 views

Technical presentation at FITC by our managing partner Thomas Joos. The presentation gives insight and behind the scene learnings.

Technical presentation at FITC by our managing partner Thomas Joos. The presentation gives insight and behind the scene learnings.

Statistics

Views

Total Views
284
Views on SlideShare
284
Embed Views
0

Actions

Likes
1
Downloads
0
Comments
0

0 Embeds 0

No embeds

Accessibility

Categories

Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

    FITC 2013 - The Technical Learning Curve FITC 2013 - The Technical Learning Curve Presentation Transcript

    • Thomas Joos, Little Miss Robot Experience Director, Partner @thomasjoos The Technical Learning Curve Thomas Joos | Little Miss Robot | @thomasjoos Thursday 28 February 13
    • -(void) helloFragmentation; Retina iOS4.0 iOS5.0 iOS6.0 320x480 640x960 HTML5 CSS3 Node.js Objective-c Java .NET OpenFrameworks IE8 IE9 Chrome Safari Firefox Opera C++ Javascript ActionScript XML JSON PHP XAML Flash Smart TV 720x1280xHDPI HDPI mHDPI lHDPI Klingon Thursday 28 February 13
    • Design  is  not  just  what  it  looks  like  and  feels  like. Design  is  how  it  works. -­‐  Steve  Jobs Thursday 28 February 13
    • YO  STEVE!   I’M  REALLY  HAPPY  FOR  YOU   AND  IMA  LET  YOU  FINISH... BUT  WITHOUT  WOZZ YOU  HAD  JACK  SHIT!   Thursday 28 February 13
    • -(void) goodLuckWithThat; Pen & Paper Adobe Photoshop Keynote Adobe Illustrator Men’s Bag Thursday 28 February 13
    • DESIGN VS DEVELOPMENT Thursday 28 February 13
    • Thursday 28 February 13
    • Our name represents our ambition to combine creative ideas with innovative technology. ‘Little Miss’ stands for dreams and fantasy without limits, like a true ten-year-old. ‘Robot’ illustrates the endless technical opportunities and evolutions in our industry. We are user- centered in every step of our process, in order to create wonderful experiences that meet the needs of real people. As a wise man once said: ‘Design is not what it looks like and feels like. Design is how it works. LITTLE MISS ROBOT Thursday 28 February 13
    • Development informs. When building a product, design leads development and development informs design. This is a cyclical, iterative process in which the goal is to continually improve the product to better meet the needs of users. source: Aral Balkan, Mobile Considerations in UX Design Thursday 28 February 13
    • You tell designers what they can or can not do. And they will show you how it should look like and feel like. You know, because that’s how it works. Thursday 28 February 13
    • A developer’s toolbox: 1 Passion for digital innovation 2 Interested in interactive design & ux 3 Great programming skills 4 The ability to say ‘I don’t know’ 5 Eager to find out ‘how the hell it works’ Thursday 28 February 13
    • The Learning Curve, you said? Thursday 28 February 13
    • Thursday 28 February 13
    • iPhone Prototype Native front-end client (iOS5.0) Rest API Webservice (http requests, JSON) Last.FM API Wim Van Buynder @wimvanbuynder Thursday 28 February 13
    • - (UIImage *)imageByScalingProportionallyToSize: (CGSize)targetSize Interesting articles:  http://stackoverflow.com/questions/2658738/the-simplest-way-to-resize-an-uiimage http://stackoverflow.com/questions/2645768/uiimage-resize-scale-proportion http://vocaro.com/trevor/blog/2009/10/12/resize-a-uiimage-the-right-way/ Thursday 28 February 13
    • - (UIImage *)imageByScalingProportionallyToSize:(CGSize)targetSize {          UIImage *sourceImage = self;     UIImage *newImage = nil;          CGSize imageSize = sourceImage.size;     CGFloat width = imageSize.width;     CGFloat height = imageSize.height;          CGFloat targetWidth = targetSize.width;     CGFloat targetHeight = targetSize.height;          CGFloat scaleFactor = 0.0;     CGFloat scaledWidth = targetWidth;     CGFloat scaledHeight = targetHeight;          CGPoint thumbnailPoint = CGPointMake(0.0,0.0);          if (CGSizeEqualToSize(imageSize, targetSize) == NO) {                  CGFloat widthFactor = targetWidth / width;         CGFloat heightFactor = targetHeight / height;                  scaleFactor = heightFactor;         scaledWidth  = width * scaleFactor;         scaledHeight = height * scaleFactor;                  // center the image                  if (widthFactor < heightFactor) {             thumbnailPoint.y = 0;          } else if (widthFactor > heightFactor) {             thumbnailPoint.x = (targetWidth - scaledWidth) * 0.5;         }     }               // this is actually the interesting part:          UIGraphicsBeginImageContext(targetSize);          CGRect thumbnailRect = CGRectZero;     thumbnailRect.origin = thumbnailPoint;     thumbnailRect.size.width  = scaledWidth;     thumbnailRect.size.height = scaledHeight;          [sourceImage drawInRect:thumbnailRect];          newImage = UIGraphicsGetImageFromCurrentImageContext();     UIGraphicsEndImageContext();          if(newImage == nil)         NSLog(@"could not scale image");          return newImage ; } Thursday 28 February 13
    • Refactoring code. Thursday 28 February 13
    • Thursday 28 February 13
    • - (UIImage *)imageByScalingProportionallyToSize:(CGSize)targetSize {          UIImage *sourceImage = self;     UIImage *newImage = nil;          CGSize imageSize = sourceImage.size;     CGFloat width = imageSize.width;     CGFloat height = imageSize.height;          CGFloat targetWidth = targetSize.width;     CGFloat targetHeight = targetSize.height;          CGFloat scaleFactor = 0.0;     CGFloat scaledWidth = targetWidth;     CGFloat scaledHeight = targetHeight;          CGPoint thumbnailPoint = CGPointMake(0.0,0.0);          if (CGSizeEqualToSize(imageSize, targetSize) == NO) {                  CGFloat widthFactor = targetWidth / width;         CGFloat heightFactor = targetHeight / height;                  scaleFactor = heightFactor;         scaledWidth  = width * scaleFactor;         scaledHeight = height * scaleFactor;                  // center the image                  if (widthFactor < heightFactor) {             thumbnailPoint.y = 0;          } else if (widthFactor > heightFactor) {             thumbnailPoint.x = (targetWidth - scaledWidth) * 0.5;         }     }               // this is actually the interesting part:          UIGraphicsBeginImageContext(targetSize);          CGRect thumbnailRect = CGRectZero;     thumbnailRect.origin = thumbnailPoint;     thumbnailRect.size.width  = scaledWidth;     thumbnailRect.size.height = scaledHeight;          [sourceImage drawInRect:thumbnailRect];          newImage = UIGraphicsGetImageFromCurrentImageContext();     UIGraphicsEndImageContext();          if(newImage == nil) //NSLog(@"could not scale image");         NSLog(@"could not scale image");          return newImage ; } = backgroundImage.contentMode = UIViewContentModeScaleAspectFill Thursday 28 February 13
    • Too often we feel the need to reinvent the wheel and program specific behavior from scratch. Always remind yourself to start from the beginning and Read The Fucking Manual. @wimvanbuynder iOS Development tip: keep reading the fucking sdk. #rtfsdk Thursday 28 February 13
    • Radio+ Beta Responsive Website HTML5, CSS3, Javascript, Node.JS Rest API Webservice (http requests, JSON) Last.FM API Gwen Vanhee @gwenvanhee Bram Monstrey @brmm Thursday 28 February 13
    • Channel name Channel logo Current Show Current Presentor Current Artist Playlist Thursday 28 February 13
    • Guys. I really think we should move away from manual polling as quickly as possible. It’s Node.JS time. @brmm Thursday 28 February 13
    • A few tiny thoughts that crossed my mind... Thursday 28 February 13
    • “ It’s not really in the scope of this project. Who am I kidding, it’s not in there at all. ” - the wallet speaking - Thursday 28 February 13
    • “ If we screw this up, it’s gonna be legen - never have to wait for it again - dary. “ - the chicken speaking - Thursday 28 February 13
    • “ Isn’t Javascript a front-end scripting language? Maybe it’s just me... “ - the inner voice speaking - Thursday 28 February 13
    • “ How cool would it be to just pull this off. “ - the ego speaking - Thursday 28 February 13
    • Node.JS A platform built on Chrome’s JavaScript runtime for easily building fast, scalable network applications. Node.js uses an event-driven, non-blocking I/O model that makes it lightweight and efficient. Perfect for data-intensive real-time applications that run across distributed devices. source: nodejs.org Thursday 28 February 13
    • Thursday 28 February 13
    • Web services Radio+ Node request content (twitter, last.fm) request additional content (radio host, program guide, ...) receives server updates push update to client Push Node Server Side Polling for updates Last.FM API Web Client (html5) NOA, On Demand, Playlist Additional Content (Radio host, program guide, ... Version 1 Thursday 28 February 13
    • Web services Radio+ Node request additional content (radio host, program guide, ...) receives server updates aggregates feed content push update to client Push Node Server Side Polling for updates Last.FM API Web Client (html5) NOA, On Demand, Playlist Additional Content (Radio host, program guide, ... Feed Node request content (twitter, last.fm) Version 2 Thursday 28 February 13
    • Web services Radio+ Node request additional content (radio host, program guide, ...) receives server updates aggregates feed content push platform optimized update to client Push Node Server Side Polling for updates Last.FM API Web Client (html5) NOA, On Demand, Playlist Additional Content (Radio host, program guide, ... Version 3 Smart TV (html5) iOS Client (obj-c) Android Client (java) Feed Node request content (twitter, last.fm) Thursday 28 February 13
    • #client overload Thursday 28 February 13
    • Guys. I really think we should integrate more Radio+ nodes to serve all those clients. @Brmm Thursday 28 February 13
    • “ It’s a good idea and ima let you finish... but it’s not going to happen.” - the wallet won - Thursday 28 February 13
    • Gwen Vanhee @gwenvanhee Thursday 28 February 13
    • littlemissrobot.com Thursday 28 February 13
    • Mobile First HTML5, CSS3, Javascript Responsive design Gwen Vanhee @gwenvanhee Thursday 28 February 13
    • I thought it would be a good idea to learn more about HTML5 for mobile. @gwenvanhee Thursday 28 February 13
    • Gwen Vanhee @gwenvanhee An interactive HTML5 drawing experiment Code::Brush Thursday 28 February 13
    • Conceptual, visual and functional, #mobilefirst stimulates you to remove the clutter and focus on what really matters. And thats a very good thing. Always. Mobile First Thursday 28 February 13
    • We are at a turning point where websites will be visited mostly by mobile devices. A new site should last for 3 years, so #mobilefirst thinking is a must. Mobile First Thursday 28 February 13
    • A few insights... Thursday 28 February 13
    • Focus on mobile friendly browsers. (IE is not one of them.) Thursday 28 February 13
    • Mobile optimalisation simply means downsizing the hell out of your download size and page requests. Thursday 28 February 13
    • Thursday 28 February 13
    • Thursday 28 February 13
    • Thursday 28 February 13
    • http://blog.netvlies.nl/design-interactie/retina-revolution/ Thursday 28 February 13
    • Thursday 28 February 13
    • Thursday 28 February 13
    • Thursday 28 February 13
    • Progressive Enrichment mobile > tablet > desktop Thursday 28 February 13
    • Too often we discuss what should happen when the canvas becomes smaller. #mobilefirst thinking means discussing what happens when the canvas becomes bigger. @gwenvanhee Thursday 28 February 13
    • Mobile Journalist iOS5 & 6 iPhone 4 & 5 Objective-C Wim Van Buynder @wimvanbuynder Thursday 28 February 13
    • Start First time Yes First run Login Approval Failed No Homescreen Record Import from library Cancel Pick image Last file takenArchive Draft Sent Uploading List item Back Edit Settings Configuration Cancel Next Collection view Back Next DetailpageDetailpage Back Update Add Disclaimer Log out Launch application Flowchart Uploader app VRT Thursday 28 February 13
    • Handling large chunks of data. Thursday 28 February 13
    • the iPhone Application Document Directory Application Application Handling large amounts of data is not really this directory’s specialty. Thursday 28 February 13
    • the iPhone Application Document Directory Application Application Global Temp Directory Saving created data directly into the iPhone’s global ‘temp’ directory. (tmp/mobilejournalist) Thursday 28 February 13
    • Thursday 28 February 13
    • “ It works like a charm. What a wonderful app you guys made. Thanks! “ - Feedback week 1 - Thursday 28 February 13
    • Thursday 28 February 13
    • “ HEY GUYS! THE APP FUCKING STOPPED WORKING FOR SOME REASON!!! “ - Feedback week 3 - Thursday 28 February 13
    • Thursday 28 February 13
    • the iPhone Application Document Directory Application Application Global Temp Directory Saving created data directly into the iPhone’s global ‘temp’ directory. (tmp/mobilejournalist) Automatically erasing random content to make space. Thursday 28 February 13
    • the iPhone Application Document Directory Application Application Global Temp Directory Saving created data directly into the iPhone’s global ‘temp’ directory. (tmp/mobilejournalist) When data is saved as draft the app automatically saves this content in the document directory. Thursday 28 February 13
    • I knew there was something like dummy-proof or granny-proof. Now I now there is also journalist-proof. @wimvanbuynder Thursday 28 February 13
    • special thanks to Wim Van Buynder @wimvanbuynder Gwen Vanhee @gwenvanhee Bram Monstrey @brmm Thursday 28 February 13
    • Thomas Joos, Little Miss Robot Experience Director, Partner @thomasjoos Defining a great experience design process. Thank you. Thomas Joos, The Technical Learning Curve FITC Amsterdam 2013 @thomasjoos Thursday 28 February 13