WebAppers

/ best free open source web resources /

Graphic Resources

8 Smashing eBooks for Responsive Web Design & JS

Posted · Category: Information

One of the neatest parts about programming is that there’s always something new to learn. And with so much knowledge to absorb you’d literally need a computer chip in your head to remember it all. That’s why it’s a great idea to build up a library of informational programming books.

Whether you’re a complete beginner or just looking to polish off some of the rust, this collection of 8 informational eBooks covers the most important aspects of coding for Web Design. These high-quality bundle from Smashing Magazine will give you the lowdown on HTML and CSS, as well as the most-recent applications for Responsive Web Design and improving your JavaScript and jQuery skills.

smashing-books

This fabulous collection of 8 Smashing eBooks all about Coding for Web Design normally sells for $39.92, but for a limited time only you can get the entire collection for just $24! That’s a 40% discount!

Quickstart: Adding HTML Controls in Windows Store App

Posted · Category: Information

Every app needs controls, such as buttons, check boxes, and drop-down lists. Windows Store apps built for Windows using JavaScript can use two types of controls: intrinsic HTML controls and Windows Library for JavaScript controls. Intrinsic HTML controls are those controls, such as buttons and check boxes, that are a part of the HTML standard.

spotlight

Here we focus on how to create and use HTML controls. The next topic, Quickstart: Adding WinJS controls and styles, describes how to create and use Windows Library for JavaScript controls.

Prerequisites

We assume that you can create a basic Windows Store app using JavaScript that uses the Windows Library for JavaScript template. For help creating your first app, see Create your first Windows Store app using JavaScript.

What is a control?

In many application programming models, you need a control to display or interact with content. Because most HTML elements are capable of displaying content and responding to a variety of events, the distinction between a control and an element isn’t always clear for Windows Store apps using JavaScript. We refer to elements and objects whose primary purpose is to provide interactivity as controls. For a list of elements and objects that fall into this category, see Controls by function.

Adding an HTML control

You can use any HTML control in your Windows Store app using JavaScript. Read the rest of this entry »

Deft and Intuitive Character Movement in HTML5 Games

Posted · Category: Information

This article recently appeared on BuildNewGames.com, a collaboration by the teams at Bocoup and Internet Explorer. Recently, I released Empty Black, my 2D shooter/puzzler/platformer. In this article, I’ll describe how I made the player movement deft and intuitive. Play the game before you read on, so you’ll know what I’m talking about.

My general approach was to change something, then try it out. I took the ideas for adjustments from several sources.

One. I examined the parameters affecting the movement of the player characters in other 2D platformers. Is the floor slippy? What is the ratio of sideways movement to jump height? Does the character accelerate as it moves? Is the character’s jump height affected by the length of time the player holds the jump button? Is the character slowed when it bumps into a moveable object?

Wolfenstein-3D

Two. I examined the unusual behaviours of the player characters in other 2D platformers. Super Meat Boy makes the character leap away from the wall automatically when wall-jumping. Spelunky lets the character pull himself up and over ledges. In Castlevania, the character can do an extra jump while in mid-air. Three. I got people to play test. Kemal told me that the character movement should be effortless. Specifically, if the character hits a wall near the top, it should slip up and over. Ricky told me it was weird that the player had no control over the height of the character’s jump. He showed me how, when hopping over an obstacle in a room with a low ceiling, he bumped his head. Ricky also pointed out the jarring effect of the initial slow down of the character when it lands after a jump. Everyone told me that airborne movement was too sensitive. Everyone told me that wall-jumping was too finicky.

Four. I read pieces written by programmers about their character movement algorithms. These pieces were mostly confined to short comments, rather than in-depth analyses. Hence, this article.   Read the rest of this entry »

How to Make Sprite Animations with HTML5 Canvas

Posted · Category: Information

This article recently appeared on BuildNewGames.com, a collaboration by the teams at Bocoup and Internet Explorer. It has been authorized to be published on WebAppers.

Sprite Fundamentals

I’ve always loved web games; they’re just fun to make, easy to code (mostly), and there’s something really nice about how accessible a game is when the user just has to click a link to start playing.

Ajax and moving dom elements around made for some fun, but limited in what kind of experience you could create. For game developers, things are changing, and quickly. HTML5 is introducing a bunch of new options for game development purely in the browser, and the browser vendors are competing hard to be the best platform for the new standards.

sprite-animations

So from a game developer’s perspective everything is going in the right direction: 2D  and 3D hardware-acceleration, high-performance javascript engines, integrated debuggers and profilers, and, probably most importantly, browser vendors who are actively racing to be the best for serious game development.

So the tools are becoming usable, the browsers capable, and the vendors are listening, we can just go make awesome games right? Well, mostly.

HTML5/Javascript game development is still early, and there’s pitfalls to avoid, as well as choices to make on which technology to deploy.

In this article I’ll run through some of the choices to be made developing 2D games, and hopefully give you some ideas for developing your own games using HTML5.

Read the rest of this entry »

205 Killer Photoshop Actions from Mighty Deal

Posted · Category: Information

Photoshop can do some magical things. By combining all sorts of tools, you can literally make thousands of variations to a single photo. And with Photoshop action sets, you can do it all with pretty much just a click.

If you’re looking for a ton of new creativity to add to your Photoshop toolbox, then have we got the Mighty Deal for you! From PhotographyPla.net comes a massive Photoshop Action Set Bundle!

You’ll get 14 premium Photoshop action sets for a total of 205 individual actions. This bundle includes the following actions: Fashion, Autumn, Vintage, Sunset & Sunrise, Black & White, Faded & Hazy, Light Leaks, Monochromatic, and more. The actions in this bundle require Photoshop CS4, CS5, or CS6.

photoshop-actions

These high-quality action sets normally cost $238 when purchased individually, but for a limited time only, you can get the entire bundle of 205 actions for just $17!

Adding WinJS Controls to a Windows Store App

Posted · Category: Information

The Windows Library for JavaScript provides a set of new controls designed for Windows Store apps using JavaScript, such as the WinJS.UI.DatePicker, WinJS.UI.FlipView, WinjS.UI.ListView, and WinJS.UI.Rating controls. It also includes two style sheets (one with a dark color scheme and one with a light) that give your app the look and feel of Windows 8.

Prerequisites

What is the Windows Library for JavaScript?

The Windows Library for JavaScript is a library of CSS and JavaScript files. It contains JavaScript objects, organized into namespaces, designed to make developing Windows Store app using JavaScript easier. Windows Library for JavaScript includes objects that help you handle activation, access storage, and define your own classes and namespaces. It also includes a set of controls: Read the rest of this entry »

A Collection of Interactive Experiences Created in HTML5

Posted · Category: Information

Jongmin Kim worked as a senior interactive designer / developer for over six years in South Korea. He has received multiple awards, including the Red Dot award, the IF award, the FWA award and the Webby award.

He always tries to “pursue a minus design rather than plus designs” and keeps in mind that “form follows function.” His style is minimal and clean, using the golden ratio and interesting typography. Form Follows Function is a collection of interactive experiences. Each experience has its own unqiue design and functionality. All the experiences are created in HTML5, the site works beautifully on both desktop and tablet.

fff

Source: http://fff.cmiscm.com/

Modernize Your HTML5 Canvas Game Part II

Posted · Category: Information

HTML5 features in modern browsers like Internet Explorer 10 make possible a whole new class of Web applications and gaming scenarios. This two-part article demonstrates how I’ve used some of these new features to modernize my last HTML5 game, HTML5 Platformer. In Part 1 of this article, I covered how to use CSS3 3D Transform, Transitions, and Grid Layout. In this article, I’ll show you how to use the offline, drag-and-drop and file APIs to implement some interesting new ideas.

Playing a Game in Offline Mode

The original version of my game worked only if your device was currently connected to the Internet. If you wanted to play to my fabulous game while you were on the train, in a taxi, or somewhere else without an Internet connection, you were out of luck—stuck without access to the awesomeness. And that’s too bad, because there really isn’t anything in my game that needs a live connection to the Web server once all the resources have been downloaded. Fortunately, offline APIs provide a solution for this in HTML5.

Read the rest of this entry »

Future Insights Live 2013 at MGM Grand Las Vegas

Posted · Category: Information

Future Insights Live 2013 is a 4-day event, comprised of one optional workshop day followed by 5 tracks and our hands-on labs over 3-days. FILive will discuss the future technologies, platforms, and business models YOU should be using and implementing to launch the next big thing.

No matter your level of ability, nor whether you are a designer, developer, product person or entrepreneur, this is the event for inspiration, education, and networking that you don’t want to miss.

future-insights

Overview

  • Coverage of the hottest web & mobile development, design, and business topics.
  • World-class speakers from across the globe.
  • Packed schedule: full day workshops, multi-track conference & hands-on learning labs.
  • Incredible atmosphere: hundreds of like-minded web folk descending on Vegas
  • All levels accommodated, something for everyone.

Workshops

  • Designing an Elegant Mobile User Experience Across Multiple Devices and Platforms – Erik Loehfelm
  • HTML5 & CSS3 Masterclass – Ryan McGinty
  • Interaction Design Beyond the Wireframe – Lis Hubert
  • Your money or your life? Designing a business that won’t kill you – Carl Smith
  • Adding Realtime Event Handling to Any Website or App – Jason Lengstorf
  • Getting Going With Node.js – Paolo Fragomeni

You can sign up with “WebAppers” discount code in order to get 10% off. Don’t forget to book your place before 1st Febuary 2013.

How to Adapt Your Site to Different Window Sizes

Posted · Category: Information

Modern browsers like Internet Explorer 10 support the width and height properties of the W3C Working Draft CSS Device Adaptation. This gives Web developers a simple tool to control automatic content scaling across various window dimensions. In particular, it enables sites to easily adapt to Windows 8 browsing on touch-enabled tablet devices in the snapped view and in portrait orientation.

Auto-Scaling and When It Is Used

Most websites have prioritized optimization for a 1024 pixel wide window. This ensures a good user experience for a wide variety of displays when the browser is maximized. However, sites may not work well on new form factors like tablets and portrait screen orientation if they haven’t optimized for other window sizes as well. In particular, pages often clip or distort layout when viewed in a narrow width.

This narrow layout is particularly important in Windows 8, where the snapped view of the browser is in this exact state. This situation also occurs for portrait mode on slate devices due to the smaller form factor. Read the rest of this entry »

Page 20 of 39...«161718192021222324»...
Supported By

Deals

Web Browsers Icon Set
Food Icon Set
Flat Icon Set

Flat Icon Set

100 icons