This is the presentation that Glenn Cahill and Onkar Matharu attended at the Queen Elizabeth Hall in London on May 26th - 27th 2011.
The conference was for the Web Directions @media conference of Web Design and Web Development.
The document discusses responsive web design. It begins by defining responsive design as making websites work on all devices. It provides an example of a responsive site and discusses how the design adapts based on screen width. It emphasizes that discrimination based on device sucks. It then discusses why responsive design is important, noting things like smartphone sales surpassing PCs and easier maintenance.
It outlines several breakpoints for different screen widths that should be designed for. It discusses using a workflow involving sketching, information architecture, mockups, prototyping, and implementation. Key technologies mentioned include HTML5, CSS3, and JavaScript. It ends by noting benefits of responsive design like better compatibility and support for more users.
If a picture's worth a thousand words, how good is video? Video is more accessible than ever and no form of marketing has a more dramatic effect on the user. Learn about the types of typical videos and how to market them effectively to capture the interest of leads and drive sales.
Everything Old is New Again: The State of Web DesignMaria D'Amato
Back to the Old School: Device-Independence with Responsive Design
Process: Art, Copy & Code: The New Creative Team
Embrace the Medium: Flat vs. Skeuomorphic Design
How to create more video content faster | Pirate SkillsPirate Skills
So, you want to create videos for your content marketing to reach and engage more potential customers? That's often much easier said than done, especially if you don't have a big support team. Videos can be much more work than, for example, writing articles or creating graphics, but they don't have to be. In this Pirate Skills meetup, we are going to give you a behind-the-scenes look into our video production workflow, so you can learn how to create video content much faster and easier.
∙ Why must creating videos be so hard?!
∙ What do we need to build a quick video creation space
∙ Which software helps us to create videos faster
∙ What are our favorite video content ideas
∙ Answering your questions about video content creation
In this hands-on session at the 2016 National Collegiate Leadership Conference, participants were introduced to various free technology tools they can use to share their personal, organizational, and professional leadership stories.
The document discusses how print is not inherently boring and argues that print and digital media can work together cooperatively. It notes that what matters most is relevance and accuracy of content. While maintaining high quality data is challenging, print remains a valuable medium that can be visually appealing, engaging, and effective for generating business when used properly. Cooperation across channels allows for greater customer response than competition between them.
How to ensure a long life span for a website?Teemu Suoranta
How can you design and implement a website that can stand the test of time? What are the biggest mistakes in content that leads to hours of manual labor later? How to avoid messing images with well thought out image sizes? How to detect and avoid plugins that will screw you later?
Guest speaker, Teemu Suoranta, works as a web developer at Aucor. There are some stories to be told after some more or less messy imports and redesigns.
The document discusses current trends in web design and development in 2015 according to Amber Leigh Turner. Some of the key trends discussed include responsive web design which ensures websites can be viewed on all devices, flat design which favors solid colors and sans-serif fonts, simplicity in design and content by removing non-essential elements, and increased use of videos and custom photography. Performance and speed are also important as designers aim to create sites that load faster.
The document discusses responsive web design. It begins by defining responsive design as making websites work on all devices. It provides an example of a responsive site and discusses how the design adapts based on screen width. It emphasizes that discrimination based on device sucks. It then discusses why responsive design is important, noting things like smartphone sales surpassing PCs and easier maintenance.
It outlines several breakpoints for different screen widths that should be designed for. It discusses using a workflow involving sketching, information architecture, mockups, prototyping, and implementation. Key technologies mentioned include HTML5, CSS3, and JavaScript. It ends by noting benefits of responsive design like better compatibility and support for more users.
If a picture's worth a thousand words, how good is video? Video is more accessible than ever and no form of marketing has a more dramatic effect on the user. Learn about the types of typical videos and how to market them effectively to capture the interest of leads and drive sales.
Everything Old is New Again: The State of Web DesignMaria D'Amato
Back to the Old School: Device-Independence with Responsive Design
Process: Art, Copy & Code: The New Creative Team
Embrace the Medium: Flat vs. Skeuomorphic Design
How to create more video content faster | Pirate SkillsPirate Skills
So, you want to create videos for your content marketing to reach and engage more potential customers? That's often much easier said than done, especially if you don't have a big support team. Videos can be much more work than, for example, writing articles or creating graphics, but they don't have to be. In this Pirate Skills meetup, we are going to give you a behind-the-scenes look into our video production workflow, so you can learn how to create video content much faster and easier.
∙ Why must creating videos be so hard?!
∙ What do we need to build a quick video creation space
∙ Which software helps us to create videos faster
∙ What are our favorite video content ideas
∙ Answering your questions about video content creation
In this hands-on session at the 2016 National Collegiate Leadership Conference, participants were introduced to various free technology tools they can use to share their personal, organizational, and professional leadership stories.
The document discusses how print is not inherently boring and argues that print and digital media can work together cooperatively. It notes that what matters most is relevance and accuracy of content. While maintaining high quality data is challenging, print remains a valuable medium that can be visually appealing, engaging, and effective for generating business when used properly. Cooperation across channels allows for greater customer response than competition between them.
How to ensure a long life span for a website?Teemu Suoranta
How can you design and implement a website that can stand the test of time? What are the biggest mistakes in content that leads to hours of manual labor later? How to avoid messing images with well thought out image sizes? How to detect and avoid plugins that will screw you later?
Guest speaker, Teemu Suoranta, works as a web developer at Aucor. There are some stories to be told after some more or less messy imports and redesigns.
The document discusses current trends in web design and development in 2015 according to Amber Leigh Turner. Some of the key trends discussed include responsive web design which ensures websites can be viewed on all devices, flat design which favors solid colors and sans-serif fonts, simplicity in design and content by removing non-essential elements, and increased use of videos and custom photography. Performance and speed are also important as designers aim to create sites that load faster.
This slideshow discusses the differences between effective and ineffective design for the presentation of information online. It includes screenshot examples of good design and poor design.
Peptide inhibitors containing electrophilic warheads were designed and synthesized to target the dengue virus NS3 protease. A boronic acid peptide inhibitor was the most potent with a Ki of 43 nM. Peptide aldehydes were also effective inhibitors in the low micromolar range. In contrast, peptides without established warheads like carboxylic acids or amides showed no inhibition. α-Ketoamides rapidly degraded to inactive lactams under assay conditions. Potent inhibition requires electrophilic groups that can form covalent bonds with the protease's active site serine residue.
In this session, we will explore the how the recent explosion of devices has disrupted the process of designing a website that we've crafted over the past decade.
When designers only have one instance of website (i.e., desktop) to design, the layout is uniform. The header, content area, sidebar, and footer all remain static. Furthermore, the elements are relatively uniform as well. Buttons, navigation, typography, and images are all basically the same across across the various pages. But if you are designing a responsive website – one whose look and feel adapts depending whether you're using a phone, laptop, or tablet – then these elements and especially the layout begin to diverge.
After this session, you should leave with the confidence to argue the importance of responsive design to your client or boss – and that the with the proper strategy, the extra effort and costs can be justified (and hopefully minimized).
Modern Digital Design: The power of Responsive DesignValtech UK
You've probably already heard of the term Responsive Design. Currently it's one of the hot topics being discussed in the digital space and something many businesses are trying to get their heads around.
So what exactly is Responsive Design? And why does it matter?
Sketching in HTML helps promote communication between designers and developers. Our developers were happy going this direction since it makes their jobs easier. Key stakeholders can see concepts in HTML from the beginning and have more confidence in designs.
The goals of the living style guide are to serve as a UX/VX lead style guide representing CustomInk design principles, be responsive, serve as documentation and support prototyping. Content needs come before designing for mobile. Typography is responsive to resize based on screen size. The living style guide provides pre-built elements and components.
HTML5 seems to stuck in a rut: we got people very excited about it but at the same time we told them it doesn't work and needs a special environment and all kind of other quick shots. Now is the time to look at HTML5 closer again and take a look at where we stand. We're in good shape, we just need to look at the mirror again.
Nitobi was moving from products to services in 2007-2008 and faced a choice between specializing or remaining agnostic in their technology stack. They chose to remain agnostic and focused on being web-based. As mobile trends emerged, they began experimenting with mobile development which led to the creation of PhoneGap in 2008 to build mobile apps using web technologies. Since then, PhoneGap has grown significantly and Nitobi's business has evolved to focus more on services related to mobile development.
Software developers love tools for coding, debugging, testing, and configuration management. The more these tools improve the How of coding, the more we see that we're behind the curve on improving the What, Why, and When. If you've been on a project that seemed vague, adrift, and endless, this talk can help. Make your projects run SMART.
This document summarizes Rik Dryfoos' presentation on software craftsmanship. It discusses that craftsmanship focuses on not just delivering working software, but well-crafted software that is easy to maintain. It presents the costs of only focusing on delivery over ownership. Craftsmanship is defined as code that is simple, lacks duplication, and is readable. The document also discusses a manifesto for software craftsmanship and challenges that top-down management poses for craftsmanship.
This document summarizes Rik Dryfoos' presentation on software craftsmanship. It discusses that craftsmanship focuses on not just delivering working software, but well-crafted software that is easy to maintain. It presents the costs of only focusing on delivery over ownership. Craftsmanship is defined as code that is simple, lacks duplication, and is readable. The document also discusses a manifesto for software craftsmanship and challenges that top-down management poses for craftsmanship.
PSEWEB 2013 - Make it responsive - TERMINALFOURTerminalfour
This document discusses responsive design and its importance for websites. It defines responsive design as a website that automatically adjusts based on the device being used. The document outlines the benefits of responsive design such as cost savings, improved user experience, and scalability. It provides tips for adopting responsive design including starting with the smallest device and focusing on key content. Examples of responsive design implementations at universities are also presented.
Responsive Design for SavvyMoney Credit ScoreWendy Fischer
The document summarizes the process for implementing a responsive design for the SavvyMoney Credit Score product. It discusses constraints including a small team, outsourced development, and a focus on quick execution over extensive planning. It proposes a strategy of rolling out responsive design features sprint by sprint using breakpoints at 960px, 768px, and 480px. Challenges include the "Frankensite" effect of a partially responsive site and the designer's lack of coding skills and experience with responsive design. Potential responsive design tools are assessed, with Adobe Photoshop and Reflow proposed as a viable option due to integration with existing workflows and assets.
Not Just a Pretty Face: Combining Form and Function for Maximum ConversionsWP Engine
The design, UX and ecommerce experts at agency Digital River, who will walk you through steps you can take to optimize the flow within your website and maximize conversions, showing examples and common mistakes made.
To view the on-demand webinar, register now at: https://hs.wpengine.com/webinar-form-function-maximum-conversions
Rich Internet Applications and Flex - 1Vijay Kalangi
This document discusses Rich Internet Applications (RIAs) and the Flex framework. It covers the evolution of applications from mainframes to modern web applications. RIAs allow for standardized cross-browser support and separation of presentation and application logic. Flex is an RIA framework based on HTML, JavaScript, AJAX, and the ActionScript programming language. It provides rich UI components and data visualization capabilities. The document concludes with an exercise on using Flex and Flash Builder to lay out interfaces, use containers and layouts, work with view states, and refactor code.
Domino, Notes, and Verse - Where are We and Whats the Future?Teamstudio
Hear from IBM's product team and learn where Notes, Domino, and Verse are headed in this webinar for administrators, application developers, and managers. The product team from IBM cover the following topics:
-Domino and Notes Directions with Scott Vrusho
-Domino Security with Dave Kern and Kevin Lynch
-IBM Verse with Scott Souder
This slideshow discusses the differences between effective and ineffective design for the presentation of information online. It includes screenshot examples of good design and poor design.
Peptide inhibitors containing electrophilic warheads were designed and synthesized to target the dengue virus NS3 protease. A boronic acid peptide inhibitor was the most potent with a Ki of 43 nM. Peptide aldehydes were also effective inhibitors in the low micromolar range. In contrast, peptides without established warheads like carboxylic acids or amides showed no inhibition. α-Ketoamides rapidly degraded to inactive lactams under assay conditions. Potent inhibition requires electrophilic groups that can form covalent bonds with the protease's active site serine residue.
In this session, we will explore the how the recent explosion of devices has disrupted the process of designing a website that we've crafted over the past decade.
When designers only have one instance of website (i.e., desktop) to design, the layout is uniform. The header, content area, sidebar, and footer all remain static. Furthermore, the elements are relatively uniform as well. Buttons, navigation, typography, and images are all basically the same across across the various pages. But if you are designing a responsive website – one whose look and feel adapts depending whether you're using a phone, laptop, or tablet – then these elements and especially the layout begin to diverge.
After this session, you should leave with the confidence to argue the importance of responsive design to your client or boss – and that the with the proper strategy, the extra effort and costs can be justified (and hopefully minimized).
Modern Digital Design: The power of Responsive DesignValtech UK
You've probably already heard of the term Responsive Design. Currently it's one of the hot topics being discussed in the digital space and something many businesses are trying to get their heads around.
So what exactly is Responsive Design? And why does it matter?
Sketching in HTML helps promote communication between designers and developers. Our developers were happy going this direction since it makes their jobs easier. Key stakeholders can see concepts in HTML from the beginning and have more confidence in designs.
The goals of the living style guide are to serve as a UX/VX lead style guide representing CustomInk design principles, be responsive, serve as documentation and support prototyping. Content needs come before designing for mobile. Typography is responsive to resize based on screen size. The living style guide provides pre-built elements and components.
HTML5 seems to stuck in a rut: we got people very excited about it but at the same time we told them it doesn't work and needs a special environment and all kind of other quick shots. Now is the time to look at HTML5 closer again and take a look at where we stand. We're in good shape, we just need to look at the mirror again.
Nitobi was moving from products to services in 2007-2008 and faced a choice between specializing or remaining agnostic in their technology stack. They chose to remain agnostic and focused on being web-based. As mobile trends emerged, they began experimenting with mobile development which led to the creation of PhoneGap in 2008 to build mobile apps using web technologies. Since then, PhoneGap has grown significantly and Nitobi's business has evolved to focus more on services related to mobile development.
Software developers love tools for coding, debugging, testing, and configuration management. The more these tools improve the How of coding, the more we see that we're behind the curve on improving the What, Why, and When. If you've been on a project that seemed vague, adrift, and endless, this talk can help. Make your projects run SMART.
This document summarizes Rik Dryfoos' presentation on software craftsmanship. It discusses that craftsmanship focuses on not just delivering working software, but well-crafted software that is easy to maintain. It presents the costs of only focusing on delivery over ownership. Craftsmanship is defined as code that is simple, lacks duplication, and is readable. The document also discusses a manifesto for software craftsmanship and challenges that top-down management poses for craftsmanship.
This document summarizes Rik Dryfoos' presentation on software craftsmanship. It discusses that craftsmanship focuses on not just delivering working software, but well-crafted software that is easy to maintain. It presents the costs of only focusing on delivery over ownership. Craftsmanship is defined as code that is simple, lacks duplication, and is readable. The document also discusses a manifesto for software craftsmanship and challenges that top-down management poses for craftsmanship.
PSEWEB 2013 - Make it responsive - TERMINALFOURTerminalfour
This document discusses responsive design and its importance for websites. It defines responsive design as a website that automatically adjusts based on the device being used. The document outlines the benefits of responsive design such as cost savings, improved user experience, and scalability. It provides tips for adopting responsive design including starting with the smallest device and focusing on key content. Examples of responsive design implementations at universities are also presented.
Responsive Design for SavvyMoney Credit ScoreWendy Fischer
The document summarizes the process for implementing a responsive design for the SavvyMoney Credit Score product. It discusses constraints including a small team, outsourced development, and a focus on quick execution over extensive planning. It proposes a strategy of rolling out responsive design features sprint by sprint using breakpoints at 960px, 768px, and 480px. Challenges include the "Frankensite" effect of a partially responsive site and the designer's lack of coding skills and experience with responsive design. Potential responsive design tools are assessed, with Adobe Photoshop and Reflow proposed as a viable option due to integration with existing workflows and assets.
Not Just a Pretty Face: Combining Form and Function for Maximum ConversionsWP Engine
The design, UX and ecommerce experts at agency Digital River, who will walk you through steps you can take to optimize the flow within your website and maximize conversions, showing examples and common mistakes made.
To view the on-demand webinar, register now at: https://hs.wpengine.com/webinar-form-function-maximum-conversions
Rich Internet Applications and Flex - 1Vijay Kalangi
This document discusses Rich Internet Applications (RIAs) and the Flex framework. It covers the evolution of applications from mainframes to modern web applications. RIAs allow for standardized cross-browser support and separation of presentation and application logic. Flex is an RIA framework based on HTML, JavaScript, AJAX, and the ActionScript programming language. It provides rich UI components and data visualization capabilities. The document concludes with an exercise on using Flex and Flash Builder to lay out interfaces, use containers and layouts, work with view states, and refactor code.
Domino, Notes, and Verse - Where are We and Whats the Future?Teamstudio
Hear from IBM's product team and learn where Notes, Domino, and Verse are headed in this webinar for administrators, application developers, and managers. The product team from IBM cover the following topics:
-Domino and Notes Directions with Scott Vrusho
-Domino Security with Dave Kern and Kevin Lynch
-IBM Verse with Scott Souder
This document summarizes two certificate programs offered by the University of Washington's Professional & Continuing Education department: the Certificate in Web Technology Solutions and the Certificate in Professional Open Source Web Development. Both programs consist of three courses delivered online or in the classroom over three quarters, focusing on technologies like JavaScript, PHP, MySQL, and frameworks. Graduates will gain skills to build dynamic, database-driven websites. The programs provide benefits like access to software downloads and discounts on Adobe Creative Suite. Instructors and staff are available to answer any questions.
Kevinjohn Gallagher's: Emperors new clothes (WordUp Glasgow 2012)kevinjohngallagher
The document discusses responsive design and some of its limitations. It argues that responsive design is really about adapting to mobile rather than different contexts. While the goals of responsive design are good, it cannot truly account for all contexts and instead relies on screen size as a proxy. This leads to problems with things like images. The document concludes that responsive design alone is not enough and that information architecture must also be considered to properly adapt a site for different contexts beyond just screen size.
Best Digital Marketing Strategy Build Your Online Presence 2024.pptxpavankumarpayexelsol
This presentation provides a comprehensive guide to the best digital marketing strategies for 2024, focusing on enhancing your online presence. Key topics include understanding and targeting your audience, building a user-friendly and mobile-responsive website, leveraging the power of social media platforms, optimizing content for search engines, and using email marketing to foster direct engagement. By adopting these strategies, you can increase brand visibility, drive traffic, generate leads, and ultimately boost sales, ensuring your business thrives in the competitive digital landscape.
2. AGENDA
what we gonna talk about?
• Glenn & Onkar’s Daily Diary
A break down of each days seminars and the lecturers that presented them.
• Webfusion @ Webdirections
Photo gallery of Webfusion at the Web Directions conference.
• Summary & closing comments
The conclusion to the event we attended, the good & bad points and where
we can take what we learned and apply them to our current work practices.
4. ar’s Dai ly Diary
Glenn and Onk
ctions Co nference
Web Dire
6t h May - 27t h May 2011
2
5. Day 1
Mastering CSS3 gradients
with Lea Verou
Very experienced front-end engineer from Greece
What was discussed?
• How using CSS can benefit page load times
• CSS Gradients can cut the time taken to make web changes, i.e buttons or CTAs
• Linear and radial gradients
• Using more than 2 colours to create your perfect gradient
6. Day 1
Server-side Javascript
with Douglas Crockford
self pro-claimed ‘father’ of Javascript
What was discussed?
• How JavaScript has evolved, and is now in a better state then it ever was
• How IE 10 will fix many issues and current drawbacks
• JavaScript node will replace PHP as it will be able to run on the server side
• Talked about creating test scripts and leaving enough time for Testing
7. Day 1
6 rules for designing amazing mobile apps
with Brian Fling
A leading designer in the mobile industry
What was discussed?
• The history of mobile design
• A history lesson about the Greeks and Romans
• Designing with interaction in mind
• Where mobile design is going in the future
8. Day 1
Tools for jQuery application architecture
with Addy Osmani
Web developer, designer and author
What was discussed?
• How important it is to have enough time to develop
• How essential it is to leave ample time to test using different scenarios,
such as browser versions, operating systems, devices etc
9. Day 1
Visualising data
with Brian Suda
A superb informatician from Reykjavík
What was discussed?
• Better ways to display data
• Using the Actor and Stage concept
• Why 3D is misleading when displaying data
• The importance of colour in displaying data
• Simple is best
10. Day 1
Native multimedia with HTML5
with Bruce Lawson
Worked on web standards for Opera
What was discussed?
• HTML 5 multimedia, future of embedding video
• HTML 5 cheats for cross browser compatibility
• Simple multimedia controls created Javascript
• Compared and talked about different browsers
- all developers facing the same browser issues
• Web videos standards - webM going to be the new standard encoding video to the
web becuase of its total cross browser compatibility
11. Day 1
What people want from mobile content
with Relly Annett-Baker
An outgoing content strategist and content writer
What was discussed?
• The importance of strategy when writing copy
• The unity and partnership between designers, copywritters and developers.
• The more specific the copy, the more the copy will sell... Create with intent
• The power of the written word
12. Day 2
Sustaining passionate users
with Stephen P Anderson
Ex-English teacher turned user experience professional.
What was discussed?
• Getting to first base with users - Trust and Psychological foreplay.
• Getting new users and existing customers to fall in love with you... and getting them to
stay in love with you
• Make things interesting and exciting to keep the customer focused
• The application of ‘Games’ to websites to keep the customer entertained and hungry
for more
13. Day 2
HTML5 offline for fun and performance
with Michael Mahemoff
Chrome developer advocate for Google
What was discussed?
• Application cache, to make an ap run while it is offline
• Client-side web storage
14. Day 2
Designing without the browser
with Hannah Donovan
A Canadian interaction designer living in London
What was discussed?
• The detail and love for a project can be shown in its explanation and wireframes.
• The absolute MUST for sketching and concept working
• The importance of leaving some holes in your concepts for people imagination
15. Day 2
Rockstar graphics with HTML5
with Dave Balmer
Senior Software Engineer with Palm Developer Relations
What was discussed?
• High-performance and animation using HTML 5, Javascript, CSS3 and Canvas
• Canvas was first introduced by Apple, as Dashboard, supporting widgets
16. Day 2
Designing - The first 15 minutes
with Daniel Burka
User interface professional based in San Francisco
What was discussed?
• The importance of getting customers excited and interested. Find you ‘Ah-Ha!‘
moment.
• Introduce the experience in phases... Hold the customers/end users hand all the way
through their adventure
• The effectiveness of using pop-ups to engage the customer/end user.
17. Day 2
Performance of CSS3 and HTML5
with Nicole Sullivan
Produces articles and youtube videos on CSS, Javascript and HTML
What was discussed?
• Selectors
• Transparency
• Double Trouble
• Rounded corners
• Gradient
18. Day 2
CSS3 Animations and Transitions
with Stephanie (Sullivan) Rewis
Front end developer and founder of W3Conversion
What was discussed?
• Browser compatability - What works where?
• Simple effects made using just CSS3
• Creative usability enhancements including CSS and mobile javascript
30. SUMMARY
& closing comments
• The Competition
- What did the competition have at the event that we didn’t?
31. SUMMARY
& closing comments
• The Event
- Was the event what we expected?
- Was the event informative and useful?
- Can we bring what we learned to our current workflow?
32. SUMMARY
& closing comments
• The Future
- From what we learned, what can we apply to our current working practices?
- How do we better ourselves and (more importantly) the competition at our next event?