The New Black - Creds

HAND-CRAFTED, DIGITALLY SOCIAL

SOLUTIONS.

HAND-CRAFTED, DIGITALLY SOCIAL

SOLUTIONS.www.newblack.me

info@newblack.me

WE ARE A SMALL CREATIVE DEVELOPMENT STUDIO, WITH A FOCUS ON USER INTERFACE

AND SOCIAL INTEGRATION.

WE ARE A SMALL CREATIVE DEVELOPMENT STUDIO, WITH A FOCUS ON USER INTERFACE

AND SOCIAL INTEGRATION.

WHO WE ARE

info@newblack.me

OVER THE PAST 3 YEARS WE HAVE BECOME EXPERTS IN

SOCIAL MEDIA DEVELOPMENT.

OVER THE PAST 3 YEARS WE HAVE BECOME EXPERTS IN

SOCIAL MEDIA DEVELOPMENT.

WHO WE ARE

info@newblack.me

WHO WE ARE

OUTLOOK—

With experience as a graphic designer, web developer, and head

of digital, Ben is perfectly placed to coordinate projects &

work directly with clients.

CURATOR &FOUNDING PARTNER

PAST—

Web developerHead of digital Graphic designer

BENBEN

OUTLOOK—

Jim is fanatic about user experience, ensuring harmonyof the function and form, andthat every app has a clear

defined purpose.

LEAD DEV / UX &FOUNDING PARTNER

PAST—

Web developerHead of digitalProduct manager Graphic designer

JIMJIM

info@newblack.me

WHO WE ARE

OUTLOOK—

Our UI perfectionist. Adams understanding and balance of

function and form allows him to create truly beautiful and

functional ideas.

DIGITAL & UI DESIGNER

PAST—

Graphic/Digital designer at agencies Fivefootsix and Zone

ADAMADAM THE

ABOUT—

Both computer science graduatesThe Toms are a formidable pair of performance obsessives. Unlike the

rest of the team The Toms work remotely.

BACKEND DEVELOPMENT& SERVER ADMIN

info@newblack.me

WHAT WE DO

Bespoke social applicationsSocial media branding

Facebook experts

Social strategy development

SOCIAL

STATIC / WEBWebsites & micro-sitesBespoke applications

Branding

E-commerce/D2C

MOBILEMobile sites

Bespoke applicationsResponsive styling

info@newblack.me

WHO WE DO IT FOR

info@newblack.me

WHO WE DO IT FOR

WINDOWS PHONE

IBIZA ROCKS HOTEL

MICROSOFT WINDOWS

TOSHIBA

BRANDSBRANDS MUSICMUSICAGENCIESAGENCIES

FILMFILM

POLYDOR RECORDS

ATLANTIC RECORDS

SONY BMG

WARNER MUSIC

NINJA TUNE

UNIVERSAL MUSIC

BMB NEON

LUCID GROUP

GRAPEVINE DIGITAL

IMPRESSIVE

STUDIO CANAL

PICTUREHOUSE

COMEDIANSCOMEDIANSMICHAEL MCINTYRE

KEVIN BRIDGES

JON RICHARDSON

info@newblack.me

WE DEVELOP FROM FRONT-TO-BACK, ALLOWING US TO COLLABORATE AND

REFINE THE USER EXPERIENCEWITH YOU, THE CLIENT.

WE DEVELOP FROM FRONT-TO-BACK, ALLOWING US TO COLLABORATE AND

REFINE THE USER EXPERIENCEWITH YOU, THE CLIENT.

HOW WE DO IT

HOW WE DO ITWET AGILE

WET AGILEWET AGILEThe 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.

CLIENT

STRATEGYSTRATEGY

In many respects this is this is the most important part of the project.

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

CREATIVECREATIVE

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 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 extremely clear idea of what to expect with the final project.

DEVELOPMENTDEVELOPMENT

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 ofthe process to be as quick and streamlined as possible, ensuring that costs are kept as lowas 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 repohas a ticketing system closely associated with it.

WHAT WE’RE ALL ABOUT

WE’RE A DESIGN LED STUDIOWE’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.

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.

WHAT WE’RE ALL ABOUTKEEPING AN EYE ON EMERGING TECH

CLIENT SIDE

SILEXWe currently use the Silex framework for all apps. This utilises some of the great features available in php 5.3 that other frameworks don’t.

SPRINGLOOPSFor ticketing on larger scale apps, deployment and Git version control of apps to facilitate collaboration between multiple developers.

COMPOSERSilex’s integration with Composer means the framework pulls the additional required libraries keeping the application lean, and allowing complete version controlling on the dependancies.

CUSTOM CMSInitial templates are written in Styl (compiles to CSS), and Jade, compiles to Twig templates(HTML), this enables fast prototypingand the use of mixins andvariables in CSS.

ENVIRONMENTSOur developers work locally, upload progress to a staging server and once approved by the client we commit to the live server.

CLIENT SIDE

WHAT WE’RE ALL ABOUTKEEPING AN EYE ON EMERGING TECH

SERVER SIDE

HTML5 / CSS 3All apps have progressively enhanced CSS3 features.

STYL/JADEInitial templates are written in Styl(compiles to CSS), and Jade, compiles to Twig templates(HTML), this enables fast prototyping and the use of mixins and variables in CSS.

COFFEESCRIPTAll Javascript is written in Coffeescript, this beautiful syntax is pre-compiled into highly optimised JS.

BACKBONE/KNOCKOUTFor front-end MVC architecture

MOUSTACHE.JSClient-side templating

SERVER SIDE

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.

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.

AND THE REST...BUT JUST AS IMPORTANT

SCOPINGMaking sure the scope of the project has been documented and signed off by both parties. We deliver no more, no less than planned.

LOCALISATIONWe’re at ease with working on multi-territory campaigns, meanings apps get deployed in different iterations depending on the user’s location.

We like to get involved in the creative process, that way you can benefit from our expertise to come up with ideas that are possible between the latest developments and boundaries of the platform you wish to develop for.

CREATIVE

SOCIAL CMSWe build custom content management systems for most of the apps we build. These can load in-tab or out and will always be bespoke for your campaign, but based on our own framework.

Our previous experience of product management and marketing means we’ve always taken metrics very seriously. Setting up marketing funnels, goal conversions, tracking user journeys and trackable links are second nature to us.

We make sure your app works as intended across all supported browsers. To achieve this we spend a lot of time testing before your app goes live.

METRICS TESTING / QA

BEL AMIProject

FACEBOOK APPFRAMEWORK

Technology

HTML/CSS/JSCustom CMSCloud hosting with Pagodabox

Build a Facebook sweepstakes competition framework that can be used across multiple film launches

LAUNCH

BEL AMIProject

Technology

LAUNCH

BEL AMIProject

Technology

LAUNCH

YOUNGMANProject

WEBSITEMOBILE SITE

Technology

HTML 5 / CSS3API’s (Twitter, Facebook, Instagram)Mobile skin

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.

LAUNCH

YOUNGMANProject

WEBSITEMOBILE SITE

Technology

LAUNCH

YOUNGMANProject

WEBSITEMOBILE SITE

Technology

LAUNCH

TEFALProject

FACEBOOK APPCUSTOM CMS

Technology

Build a ‘welcome’ tab highlighting Tefal’s products and other online destinations and initiatives.

LAUNCH

TEFALProject

Technology

LAUNCH

TEFALProject

Technology

LAUNCH

TEFALProject

Technology

LAUNCH

XBOX 360Project

FACEBOOK APPBING MAPS

TechnologyHTML / CSS / JSAPI’s-(Bing maps, Viddler, Youtube)Custom CMSCloud hosting with Pagodabox

Deliver tools for a full social media campaign in support of above the line marketing activity.

XBOX 360Project

WINDOWSPHONE

Project

SOCIAL MEDIA SKINNINGFACEBOOK TABWORDPRESS SITE

Technology

HTML / CSS / JSCustom CMSWordpress skinCloud hosting with Pagodabox

Re-brand a couple of Windows Phone blogs and social media pages including Facebook, Twitter and Youtube.

LAUNCH

Owen - be good to use an updated screenshot here. http://www.mykindofphone.com/

WINDOWSPHONE

Project

Technology

LAUNCH

WINDOWSPHONE

Project

Technology

LAUNCH

WINDOWSPHONE

Project

Technology

LAUNCH

WINDOWSPHONE

Project

Technology

LAUNCH

WINDOWSAAA

Project

FACEBOOK APPSOCIAL MEDIA RE-SKIN

Technology

HTML / CSS / JSCustom in-tab CMS

Re-skin all of the Facebook tabs to match the new branding guidelines for the 2012 campaign.

LAUNCH

WINDOWSAAA

Project

Technology

LAUNCH

WINDOWSAAA

Project

Technology

LAUNCH

WINDOWSAAA

Project

Technology

LAUNCH

WINDOWSAAA

Project

Technology

LAUNCH

P.A.B.HPULLED APART BY HORSES

Project

FACEBOOK APPCOMP’ FRAMEWORK

Technology

HTML / CSS / JSCustom Soundcloud Player(API)Cloud hosting with Pagodabox

Deliver a creative way of offering content in exchange for directing their friends back to the app as a framework which can be refreshed.

LAUNCH

Project

Technology

LAUNCH

Project

Technology

LAUNCH

Project

Technology

LAUNCH

Project

Technology

LAUNCH

WINDOWSBRINGING DOWN THE HOUSE

Project

FACEBOOK APPVIDEO SUBMISSION

Technology

HTML 5 / CSS 3 / JSViddler video API for webcam submissions and file uploads.Cloud hosting with Heroku

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.

Project

Technology

Project

Technology

Project

Technology

PLAN BProject

RESPONSIVE SITEMOBILE

Technology

HTML 5 / CSS 3 / JSSoundcloud, Youtube, Twitter, Facebook APIsCustom CMS

Build a responsive website which will play nice on a desktop, tablets and mobile phones

PLAN BProject

Technology

PLAN BProject

Technology

PLAN BProject

Technology

PLAN BProject

Technology

CHRIS BROWNProject

FACEBOOK APP

Technology

HTML 5 / CSS 3 / JSFacebook/Twitter APICloud hosting with Pagodabox

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.

CHRIS BROWNProject

FACEBOOK APP

Technology

CHRIS BROWNProject

FACEBOOK APP

Technology

CHRIS BROWNProject

FACEBOOK APP

Technology

CUSTOMCMS

Project

FACEBOOK APPBOOTSTRAP

Details

As part of Facebook appwork 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.

CUSTOMCMS

Project

FACEBOOK APPBOOTSTRAP

Details

As part of Facebook appwork 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.

FACEBOOKCOMPETITIONAPP BUILDER

Project

FACEBOOK APPWHITE LABEL SOLUTION

Technology

HTML/CSS/JSBing maps, Viddler, Youtube APICustom CMSCloud hosting with Pagodabox

A tool that allows our client to launch Facebook different types of competitions on their Facebook profiles.

Project

Technology

Project

Technology

Project

Technology

THANK YOU

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

The New Black - Creds

Technology

Transcript of The New Black - Creds

Kodu Creds

hawkeye creds

Apposing Creds

Aeon Creds

Creds Test

Master redesign creds

Giftcloud creds

Slideshare creds

blueprint.tv creds

Digital Creds 2015

Gilroy Creds 2015

Adworks Creds

Cream Creds

Verve Creds

Marcus Ray creds

NORVICSON ADVERTISING- CREDS

Allotment Creds

Fountain summary creds

Social Creds

MediaBodies creds 2015