Download to read offline
![- (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](https://image.slidesharecdn.com/thomasjoosfitc1m13lite-130912070634-phpapp01/85/FITC-2013-The-Technical-Learning-Curve-16-320.jpg)
![- (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](https://image.slidesharecdn.com/thomasjoosfitc1m13lite-130912070634-phpapp01/85/FITC-2013-The-Technical-Learning-Curve-19-320.jpg)
Uploaded byLittle Miss Robot
FITC 2013 - The Technical Learning Curve
The document discusses the philosophy and process of experience design, emphasizing the integration of creativity and technology to enhance user experience. It outlines the importance of a cyclical design and development process, where each informs the other to continually improve products. Additionally, it highlights the trend towards mobile-first design principles and the need for developers to possess a strong understanding of both UX and programming skills.
![5G Explained! A High Level Overview [Introduction]](https://cdn.slidesharecdn.com/ss_thumbnails/5gexplainedahighleveloverview-260119165306-cc137a3e-thumbnail.jpg?width=640&height=640&fit=bounds)
FITC 2013 - The Technical Learning Curve
- 1. Thomas Joos, LittleMiss Robot Experience Director, Partner @thomasjoos The Technical Learning Curve Thomas Joos | Little Miss Robot | @thomasjoos Thursday 28 February 13
- 2. -(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 SmartTV 720x1280xHDPI HDPI mHDPI lHDPI Klingon Thursday 28 February 13
- 3. Design is not just what it looks like and feels like. Design is how it works. -‐ Steve Jobs Thursday 28 February 13
- 4. YO STEVE! I’M REALLY HAPPY FOR YOU AND IMA LET YOU FINISH... BUT WITHOUT WOZZ YOU HAD JACK SHIT! Thursday 28 February 13
- 5. -(void) goodLuckWithThat; Pen &Paper Adobe Photoshop Keynote Adobe Illustrator Men’s Bag Thursday 28 February 13
- 6.
- 7.
- 8. Our name representsour 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
- 9. Development informs. When buildinga 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
- 10. You tell designerswhat 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
- 11. A developer’s toolbox: 1Passion 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
- 12. The Learning Curve, yousaid? Thursday 28 February 13
- 13.
- 14. iPhone Prototype Native front-endclient (iOS5.0) Rest API Webservice (http requests, JSON) Last.FM API Wim Van Buynder @wimvanbuynder Thursday 28 February 13
- 15. - (UIImage *)imageByScalingProportionallyToSize: (CGSize)targetSize Interestingarticles: 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
- 16. - (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
- 17. Refactoring code. Thursday 28February 13
- 18.
- 19. - (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
- 20. Too often wefeel 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
- 21. 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
- 22. Channel name Channel logo CurrentShow Current Presentor Current Artist Playlist Thursday 28 February 13
- 23. Guys. I reallythink we should move away from manual polling as quickly as possible. It’s Node.JS time. @brmm Thursday 28 February 13
- 24. A few tinythoughts that crossed my mind... Thursday 28 February 13
- 25. “ It’s notreally in the scope of this project. Who am I kidding, it’s not in there at all. ” - the wallet speaking - Thursday 28 February 13
- 26. “ If wescrew this up, it’s gonna be legen - never have to wait for it again - dary. “ - the chicken speaking - Thursday 28 February 13
- 27. “ Isn’t Javascripta front-end scripting language? Maybe it’s just me... “ - the inner voice speaking - Thursday 28 February 13
- 28. “ How coolwould it be to just pull this off. “ - the ego speaking - Thursday 28 February 13
- 29. Node.JS A platform builton 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
- 30.
- 31. 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
- 32. Web services Radio+ Node request additionalcontent (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
- 33. Web services Radio+ Node request additionalcontent (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
- 34. #client overload Thursday 28February 13
- 35. Guys. I reallythink we should integrate more Radio+ nodes to serve all those clients. @Brmm Thursday 28 February 13
- 36. “ It’s agood idea and ima let you finish... but it’s not going to happen.” - the wallet won - Thursday 28 February 13
- 37. Gwen Vanhee @gwenvanhee Thursday 28February 13
- 38.
- 39. Mobile First HTML5, CSS3,Javascript Responsive design Gwen Vanhee @gwenvanhee Thursday 28 February 13
- 40. I thought itwould be a good idea to learn more about HTML5 for mobile. @gwenvanhee Thursday 28 February 13
- 41. Gwen Vanhee @gwenvanhee An interactiveHTML5 drawing experiment Code::Brush Thursday 28 February 13
- 42. Conceptual, visual andfunctional, #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
- 43. We are ata 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
- 44. A few insights... Thursday28 February 13
- 45. Focus on mobilefriendly browsers. (IE is not one of them.) Thursday 28 February 13
- 46. Mobile optimalisation simplymeans downsizing the hell out of your download size and page requests. Thursday 28 February 13
- 47.
- 48.
- 49.
- 50.
- 51.
- 52.
- 53.
- 54. Progressive Enrichment mobile >tablet > desktop Thursday 28 February 13
- 55. Too often wediscuss what should happen when the canvas becomes smaller. #mobilefirst thinking means discussing what happens when the canvas becomes bigger. @gwenvanhee Thursday 28 February 13
- 56. Mobile Journalist iOS5 &6 iPhone 4 & 5 Objective-C Wim Van Buynder @wimvanbuynder Thursday 28 February 13
- 57. Start First time YesFirst 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
- 58. Handling large chunksof data. Thursday 28 February 13
- 59. the iPhone Application Document Directory Application Application Handling largeamounts of data is not really this directory’s specialty. Thursday 28 February 13
- 60. the iPhone Application Document Directory Application Application Global Temp Directory Savingcreated data directly into the iPhone’s global ‘temp’ directory. (tmp/mobilejournalist) Thursday 28 February 13
- 61.
- 62. “ It workslike a charm. What a wonderful app you guys made. Thanks! “ - Feedback week 1 - Thursday 28 February 13
- 63.
- 64. “ HEY GUYS!THE APP FUCKING STOPPED WORKING FOR SOME REASON!!! “ - Feedback week 3 - Thursday 28 February 13
- 65.
- 66. the iPhone Application Document Directory Application Application Global Temp Directory Savingcreated data directly into the iPhone’s global ‘temp’ directory. (tmp/mobilejournalist) Automatically erasing random content to make space. Thursday 28 February 13
- 67. the iPhone Application Document Directory Application Application Global Temp Directory Savingcreated 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
- 68. I knew therewas something like dummy-proof or granny-proof. Now I now there is also journalist-proof. @wimvanbuynder Thursday 28 February 13
- 69. special thanks to WimVan Buynder @wimvanbuynder Gwen Vanhee @gwenvanhee Bram Monstrey @brmm Thursday 28 February 13
- 70. Thomas Joos, LittleMiss 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