The New Black - Creds

2. HAND-CRAFTED, DIGITALLY SOCIAL SOLUTIONS. www.newblack.me

3. WHO WE ARE WE ARE A SMALL CREATIVE DEVELOPMENT STUDIO, WITH A FOCUS ON USER INTERFACE AND SOCIAL INTEGRATION. info@newblack.me

4. WHO WE ARE OVER THE PAST 3 YEARS WE HAVE BECOME EXPERTS IN SOCIAL MEDIA DEVELOPMENT. info@newblack.me

5. WHO WE ARE BEN JIM CURATOR & LEAD DEV / UX & FOUNDING PARTNER FOUNDING PARTNER PAST PAST — — Web developer Web developer Head of digital Head of digital Graphic designer Product manager Graphic designer OUTLOOK OUTLOOK — — With experience as a graphic Jim is fanatic about user designer, web developer, and head experience, ensuring harmony of digital, Ben is perfectly of the function and form, and placed to coordinate projects & that every app has a clear work directly with clients. defined purpose. info@newblack.me

6. WHO WE ARE THE ADAM TOMS DIGITAL & BACKEND DEVELOPMENT UI DESIGNER & SERVER ADMIN PAST — Graphic/Digital designer at agencies Fivefootsix and Zone ABOUT — Both computer science graduates The Toms are a formidable pair of performance obsessives. Unlike the OUTLOOK rest of the team The Toms — work remotely. Our UI perfectionist. Adams understanding and balance of function and form allows him to create truly beautiful and functional ideas. info@newblack.me

7. WHAT WE DO STATIC / WEB Websites & micro-sites Bespoke applications Branding E-commerce/D2C SOCIAL Bespoke social applications Social media branding Facebook experts Social strategy development MOBILE Mobile sites Bespoke applications Responsive styling info@newblack.me

8. WHO WE DO IT FOR info@newblack.me

9. WHO WE DO IT FOR BRANDS AGENCIES MUSIC POLYDOR RECORDS XBOX BMB NEON ATLANTIC RECORDS WINDOWS PHONE LUCID GROUP IBIZA ROCKS HOTEL SONY BMG GRAPEVINE DIGITAL MICROSOFT WINDOWS WARNER MUSIC IMPRESSIVE TOSHIBA NINJA TUNE TEFAL UNIVERSAL MUSIC BIC FILM COMEDIANS STUDIO CANAL MICHAEL MCINTYRE PICTUREHOUSE KEVIN BRIDGES JON RICHARDSON info@newblack.me

10. HOW WE DO IT WE DEVELOP FROM FRONT-TO-BACK, ALLOWING US TO COLLABORATE AND REFINE THE USER EXPERIENCE WITH YOU, THE CLIENT. info@newblack.me

11. HOW WE DO IT WET AGILE WET AGILE The most important thing is we are always learning and adjusting the way we work, listening to clients to create processes that will serve them better. The following diagram illustrates how we currently work. We find this approach (a mix of Agile and Waterfall) to deliver the greatest level of speed and flexibility whilst allowing us to meet tight deadlines.

12. In many respects this is this is the most important part of the project. STRATEGY We cycle through reviews, collaborating with the client to ensure the concept is the best it can be. At this stage everyone at The New Black is involved, ensuring we have technical, marketing and user insight. CLIENT

13. After the strategy has been firmed up, we try to realise the dream. Rather than spending hours on lengthy spec documents that are somewhat abstracted from CREATIVE any final product, we work with the client to find the right tone and journey for their audience, by again adopting a highly iterative approach of how each part of the journey will look and act. This ensures that the client has an CLIENT extremely clear idea of what to expect with the final project.

14. By the time we start development, we have an extremely detailed set of mockups. Development happens in a very linear fashion with the frontend & backend developers working together simultaneously. The previous iterations allow this part of DEVELOPMENT the process to be as quick and streamlined as possible, ensuring that costs are kept as low as possible. During the process, frontend templates are submitted to the UI designer to ensure all implementations are true to his vision. All code is developed locally and regularly deployed to a private Git repo. This Git repo has a ticketing system closely associated with it.

15. WHAT WE’RE ALL ABOUT # 1 WE’RE A DESIGN LED STUDIO While we marvel at things that look pretty - design doesn’t just refer to the way something looks. Design is also about the way something is built, the underlying mechanics that make it run smoothly.

16. WHAT WE’RE ALL ABOUT # 2 KEEPING AN EYE ON EMERGING TECH When it comes to technology we like to stay on the cutting edge, meaning we’re always looking at exploring the latest tools and technology trends to determine 2 things: 1. Can we translate them into ideas which can be groundbreaking. 2. Can we work them into our workflow Once we feel comfortable enough with a new technology and we feel it is rock solid, we integrate it into our projects.

17. WHAT WE’RE ALL ABOUT KEEPING AN EYE ON EMERGING TECH #2 CLIENT SIDE SILEX COMPOSER CUSTOM CMS We currently use the Silex Silex’s integration with Composer Initial templates are written in framework for all apps. This means the framework pulls the Styl (compiles to CSS), and Jade, utilises some of the great additional required libraries compiles to Twig templates(HTML), features available in php 5.3 keeping the application lean, and this enables fast prototyping that other frameworks don’t. allowing complete version and the use of mixins and controlling on the dependancies. variables in CSS. SPRINGLOOPS ENVIRONMENTS For ticketing on larger scale apps, Our developers work locally, upload deployment and Git version control of progress to a staging server and once apps to facilitate collaboration approved by the client we commit to between multiple developers. the live server.

18. WHAT WE’RE ALL ABOUT KEEPING AN EYE ON EMERGING TECH #2 SERVER SIDE HTML5 / CSS 3 COFFEESCRIPT BACKBONE/ All apps have progressively All Javascript is written in KNOCKOUT enhanced CSS3 features. Coffeescript, this beautiful syntax is pre-compiled into For front-end MVC architecture highly optimised JS. STYL/JADE MOUSTACHE.JS Initial templates are written in Styl Client-side templating (compiles to CSS), and Jade, compiles to Twig templates(HTML), this enables fast prototyping and the use of mixins and variables in CSS.

19. WHAT WE’RE ALL ABOUT # 3 SENSIBLE STRATEGY & MARKETING In a previous life we came from a strategy and marketing background, with plenty of experience to match that. This means we understand the needs of our clients more than your average development house. Our aim is to work with you to develop a sensible strategy to effectively deliver against your objectives.

20. WHAT WE’RE ALL ABOUT # 4 COLLABORATIVE IDEA GENERATION While being able to do everything in-house generally leads to a smoother workflow, the reality is you don’t always get that luxury. We pride ourselves on an excellent project management process, which allows us to manage and work with multiple external companies. We also enjoy collaboration, the sharing of ideas and meeting people with a different thought-process. We embrace the experience and think it’s necessary to make us a better company.

21. AND THE REST... BUT JUST AS IMPORTANT PLUS SCOPING LOCALISATION CREATIVE Making sure the scope of the We’re at ease with working on We like to get involved in the project has been documented multi-territory campaigns, creative process, that way you and signed off by both meanings apps get deployed in can benefit from our expertise parties. We deliver no more, different iterations depending to come up with ideas that are no less than planned. on the user’s location. possible between the latest developments and boundaries of the platform you wish to develop for. METRICS TESTING / QA SOCIAL CMS Our previous experience of We make sure your app works as We build custom content product management and marketing intended across all supported management systems for most of means we’ve always taken metrics browsers. To achieve this we the apps we build. These can very seriously. Setting up spend a lot of time testing load in-tab or out and will marketing funnels, goal before your app goes live. always be bespoke for your conversions, tracking user campaign, but based on our own journeys and trackable links are framework. second nature to us.

22. Project BEL AMI Tags FACEBOOK APP FRAMEWORK Brief Build a Facebook sweepstakes competition framework that can be used across multiple film launches Technology HTML/CSS/JS Custom CMS Cloud hosting with Pagodabox LAUNCH

25. Project YOUNGMAN Tags WEBSITE MOBILE SITE Brief Polydor Records approached us about putting together a splash for Youngman, the brief mentioned a mobile skin which would display most of the content from the web version. Technology HTML 5 / CSS3 API’s (Twitter, Facebook, Instagram) Mobile skin LAUNCH

28. Project TEFAL Tags FACEBOOK APP CUSTOM CMS Brief Build a ‘welcome’ tab highlighting Tefal’s products and other online destinations and initiatives. Technology HTML/CSS/JS Custom CMS Cloud hosting with Pagodabox LAUNCH

32. Project XBOX 360 Tags FACEBOOK APP BING MAPS Brief Deliver tools for a full social media campaign in support of above the line marketing activity. Technology HTML / CSS / JS API’s-(Bing maps, Viddler, Youtube) Custom CMS Cloud hosting with Pagodabox

37. Project WINDOWS PHONE Tags SOCIAL MEDIA SKINNING FACEBOOK TAB WORDPRESS SITE Owen - be good to use an updated Brief screenshot here. Re-brand a couple of Windows http://www.mykindofphone.com/ Phone blogs and social media pages including Facebook, Twitter and Youtube. Technology HTML / CSS / JS Custom CMS Wordpress skin Cloud hosting with Pagodabox LAUNCH

42. Project WINDOWS AAA Tags FACEBOOK APP SOCIAL MEDIA RE-SKIN Brief Re-skin all of the Facebook tabs to match the new branding guidelines for the 2012 campaign. Technology HTML / CSS / JS Custom in-tab CMS LAUNCH

47. Project P APART BY HORSES .A.B.H PULLED Tags FACEBOOK APP COMP’ FRAMEWORK Brief Deliver a creative way of offering content in exchange for directing their friends back to the app as a framework which can be refreshed. Technology HTML / CSS / JS Custom Soundcloud Player(API) Cloud hosting with Pagodabox LAUNCH

52. Project WINDOWS BRINGING DOWN THE HOUSE Tags FACEBOOK APP VIDEO SUBMISSION Brief Microsoft were to offer a full house makeover for students using some of the latest tech gear. The goal was to come up with a fun mechanic for students with a viral aspect and UGC. Technology HTML 5 / CSS 3 / JS Viddler video API for webcam submissions and file uploads. Cloud hosting with Heroku

56. Project PLAN B Tags RESPONSIVE SITE MOBILE Brief Build a responsive website which will play nice on a desktop, tablets and mobile phones Technology HTML 5 / CSS 3 / JS Soundcloud, Youtube, Twitter, Facebook APIs Custom CMS

61. Project CHRIS BROWN Tags FACEBOOK APP Brief Sony Music had big plans for Chris Brown, the aim was to get an #1 album. To support this, they needed something unique and beautiful to help engage with Chris’ fanbase. Technology HTML 5 / CSS 3 / JS Facebook/Twitter API Cloud hosting with Pagodabox

65. Project CUSTOM CMS Tags FACEBOOK APP BOOTSTRAP Details As part of Facebook app work we build white label custom CMS solutions based on the Bootstrap framework. The framework is very flexible, meaning each iteration can be tailored to your project’s specific requirements.

66. Project CUSTOM CMS Tags FACEBOOK APP BOOTSTRAP Details As part of Facebook app work we build white label custom CMS solutions based on the Bootstrap framework. The framework is very flexible, meaning each iteration can be tailored to your project’s specific requirements.

67. Project FACEBOOK COMPETITION APP BUILDER Tags FACEBOOK APP WHITE LABEL SOLUTION Brief A tool that allows our client to launch Facebook different types of competitions on their Facebook profiles. Technology HTML/CSS/JS Bing maps, Viddler, Youtube API Custom CMS Cloud hosting with Pagodabox

71. THANK YOU ADDRESS: 235 UPPER STREET, N1R 4RU LONDON, UK | PHONE: +44 207 096 4217 WEB: WWW.NEWBLACK.ME | EMAIL: INFO@NEWBLACK.ME | TWITTER: @THENEWBLACK | FACEBOOK.COM/THENEWBLACKUK

The New Black - Creds

Recommended

Recommended

More Related Content

What's hot

What's hot (20)

Viewers also liked

Viewers also liked (20)

Similar to The New Black - Creds

Similar to The New Black - Creds (20)

Recently uploaded

Recently uploaded (20)

The New Black - Creds