recentpopularlog in

robertogreco : javascript   102

« earlier  
Animating URLs with Javascript and Emojis
“You can use emoji (and other graphical unicode characters) in URLs. And wow is it great. But no one seems to do it. Why? Perhaps emoji are too exotic for normie web platforms to handle? Or maybe they are avoided for fear of angering the SEO gods?

Whatever the reason, the overlapping portion on the Venn diagram of “It’s Possible v.s. No One Is Doing It” is where my excitement usually lies. So I decided to put a little time into the possibilities of graphical characters in URLs. Specifically, with the possibility for animating these characters by way of some Javascript.”

[direct link to video: https://www.youtube.com/watch?v=4YZt4HEv48Y ]
matthewrayfield  animation  emoji  javascript  webdev 
19 days ago by robertogreco
Sanity.io - The fully customisable headless CMS
"Distribute to any device or channel over flexible APIs. Fully customizable React.js editor."
react.js  javascript  cms  api  webdev 
20 days ago by robertogreco
Rabbit Ear, origami and creative code
"Rabbit Ear is a creative coding javascript library for designing origami."

[See also: https://origami.pw/docs/ ]
software  origami  folding  classideas  foreden  computation  geometry  javascript  programming 
june 2018 by robertogreco
Paper Programs
[via: https://twitter.com/andy_matuschak/status/967807879892709376 ]

"Paper ProgramsPaper Programs is a browser-based system for running Javascript programs on pieces of paper.

You set up a projector and camera aimed at a wall, table, or floor, and print out papers that are recognised and executed by the system.

[tutorial video: https://www.youtube.com/watch?v=pkwSoJrVWAY ]

FAQ

Who created Paper Programs? And why?
Hi, I’m JP. There are lots of reasons I could list for building Paper Programs, such as having worked on interactive tools for many years, a background in programming education, and having experimented with different representations of program execution. But the truth is, I was just unreasonably excited after trying Dynamicland for the first time, and wanted to explore their interaction model more.

Much thanks to everyone who helped testing Paper Programs. Special thanks to Omar Rizwan for sort-of instigating this project, and offering tons of ideas and feedback.

How is Paper Programs related to Dynamicland?
Paper Programs is inspired by the projector and camera setup of the 2017 iteration of Dynamicland. I liked how you could physically hold a program in your hands, and then put on any surface in the building, where it would start executing, as if by magic. And I liked how people naturally started collaborating, writing programs that interact with each other.

In contrast, Dynamicland is a community space designed around Realtalk. Realtalk is a research operating system (in development for several years) designed to bring computation into the physical world. It is more general than papers, projectors, and cameras. Dynamicland is intended as a new medium of human communication, and is designed to be learned and used by a community of people interacting face-to-face, not over the internet.

Paper Programs is not a clone of Dynamicland. To learn more about their system and vision, be sure to visit Dynamicland in Oakland.

How does Paper Programs work?
Programs are stored on a server (using Node.js and PostgreSQL), hosted on paperprograms.org. Each program has a number, and the dots on the paper encode that number. Currently each corner is uniquely identified with 5 dots of 5 possible colours, which means you can have about 600 unique papers currently (this is a significant limitation).

A camera detects the dots and retrieves the program associated with each paper. This is done in a browser, using OpenCV compiled to WebAssembly, and some custom Javascript code. Calibration happens manually, using a UI built in React. Program code and configuration are stored in the browser’s local storage.

Projection and execution of programs happens in a separate browser window. Each program runs asynchronously in a Web Worker, and can request access to a canvas, coordinates of other programs, and so on.

Then there is an editor page, which anyone in the space with a laptop or tablet can use to edit programs, using Monaco. When having created a new program, you can click a print button to print out a new paper that runs that program. It has the program text printed on the paper itself. Any edited program can be reverted to its original state.

How can I help?
If you’re interested in contributing to Paper Programs, feel free to submit PRs, bugs, and suggestions at the Github repo. And please tag any posts in social media with #paperprograms."
javascript  programming  paper  art  projectors  dynamicland 
february 2018 by robertogreco
Stencil
"Stencil is a compiler that generates Web Components (more specifically, Custom Elements). Stencil combines the best concepts of the most popular frameworks into a simple build-time tool.

Stencil takes features such as

Virtual DOM
Async rendering (inspired by React Fiber)
Reactive data-binding
TypeScript
JSX
and then generates standards-based Web Components with these features baked in.

Since Stencil generates standards-compliant web components, they can work with many popular frameworks right out of the box, and can be used without a framework because they are just web components. Stencil also enables a number of key capabilities on top of Web Components, in particular Server Side Rendering (SSR) without the need to run a headless browser, pre-rendering, and objects-as-properties (instead of just strings).

Compared to using Custom Elements directly, Stencil provides extra APIs that makes writing fast components simpler. APIs like Virtual DOM, JSX, and async rendering make fast, powerful components easy to create, while still maintaining 100% compatibility with Web Components.

The developer experience is also tuned, and comes with live reload and a small dev server baked in to the compiler.

Why Stencil?
Stencil was created by the Ionic Framework team to help build faster, more capable components that worked across all major frameworks.

While Ionic primarily targeted Cordova apps, the emergence of Progressive Web Apps as a rapidly growing target for web developers demanded a different approach to web app development performance. With Ionic's classic use of traditional frameworks and bundling techniques, the team was struggling to meet latency and code size demands for Progressive Web Apps that ran equally well on fast and slow networks, across a diversity of platforms and devices.

Additionally, framework fragmentation had created a web development interoperability nightmare, where components built for one framework didn't work with another framework.

Web Components offered a solution to both problems, pushing more work to the browser for better performance, and targeting a standards-based component model that all frameworks could use.

However, Web Components by themselves weren't enough. Building fast web apps required innovations that were previously locked up inside of traditional web frameworks. Stencil was built to pull these features out of traditional frameworks and bring them to the fast emerging Web Component standard."
webcomponents  javascript  web  generator  onlinetoolkit  webdev 
january 2018 by robertogreco
OpenLayers 3 - Welcome
"A high-performance, feature-packed library for all your mapping needs.

FEATURES

Tiled Layers
Pull tiles from OSM, Bing, MapBox, Stamen, MapQuest, and any other XYZ source you can find. OGC mapping services and untiled layers also supported.

Vector Layers
Render vector data from GeoJSON, TopoJSON, KML, GML, and a growing number of other formats.

Fast & Mobile Ready
Mobile support out of the box. Build lightweight custom profiles with just the components you need.

Cutting Edge & Easy to Customize
Map rendering leverages WebGL, Canvas 2D, and all the latest greatness from HTML5. Style your map controls with straight-forward CSS."

[via: http://elasticterrain.xyz/
via: https://twitter.com/moritz_stefaner/status/711850707859673088 ]
gis  javascript  mapping  maps  opensource  cartography  webdev  openlayers  webdesign 
march 2016 by robertogreco
mbostock (Mike Bostock)
[via: http://www.wired.com/2015/09/essential-social-media-feeds/

"Mike Bostock | Github
Let Bostock—until recently a graphics editor at The New York Times—show you how he uses the web’s native languages to turn raw numbers into shapes, colors, graphs, charts, and maps."]
javascript  visualization  github  d3  mikebostock  webdev  coding  webdesign 
january 2016 by robertogreco
Hypertext for all | A Working Library
"These rococo days of the web have been sadly lost to capricious corporate owners, and newer platforms almost seem to have recoiled from them. (I could write a whole other letter about the neutered minimalism common on a lot of platforms today, but I digress.) But I think that history is telling: in that, given a canvas on which to play, many people opted to express themselves with color and image, often spending much more effort there then on the words, and often in surprising ways.

So, I’ll ask again, is hypertext just the text? Are images, styles, video, fonts, and the like always subsidiary?

There’s an old saw about the web that says that when the web democratized publishing, everyone should have become a writer, but instead most of us became consumers. (Nevermind that email and SMS have most people writing more in a day than their Victorian ancestors wrote in their entire lives.) There’s more than a hint of disparagement and elitism in that saying: everyone should have taken up writing, which is obviously superior to reading or watching or (gasp!) consuming. And I worry that that same sentiment creeps in when we argue the supremacy of text over image on the web. Writing is an important and valuable skill, but so are many other things.

Here’s another way to think about it: over the past year, video after video has emerged showing cops shooting unarmed black people. Those videos have been shared on the web, and while they haven’t yet led to anything resembling justice for the victims, they have contributed to profound discussions around race, militarized police forces, guns, and more. They are not sufficient to bring about desperately needed social change—and there’s an argument to be made about whether they are at risk of becoming mere spectacle—but I think it would be hard to deny that they are an important element in the movement, that they have had a major impact.

You can describe what happens in each of those videos in words, but those words will never equal watching them. The words “Tamir Rice was shot two seconds after the police car pulled up” are wrenching, but not nearly as much as watching him fall to the ground as the car continues to roll. The words “Tamir Rice was twelve years old” are not as heart stoppable as seeing a photo of him. I am saying this as someone who believes in words, who spends more time with words than with pictures, who is more often moved by words than by images. But sometimes the power of an image dwarfs that of words. Even I have to admit that.

I worry that the push to keep the web defined to words, while pragmatic and reasonable in many ways, may also be used to decide what stories get told, and what stories are heard. Many more people are using their tiny computers to record video and audio and take pictures than are writing; as much as I may love writing, and as much as I know that transmitting writing via cables and air is a hell of a lot easier and cheaper than transmitting video, I’m not sure I can really stand here and say that the writing is—or should be—primary.

One of the design principles of the web is to pave the cowpaths: it looks to me like there are some new paths opening up, ones we may not have expected, ones that aren’t going to make many of our jobs easier. Maybe instead of putting up signs saying there are better paths elsewhere, it’s time we see where these ones take us."

[Noted here: https://twitter.com/rogre/status/683849479385001984 ]
mandybrown  2016  web  hypertext  maciejceglowski  geocities  myspace  webrococo  waybackmachine  pinboard  javascript  webdesign  webdev  images  multiliteracies  video  flash  zefrank  design  writing  text  words  language  listening  elitism  typography  tools  onlinetoolkit  democacy  activism  maciejcegłowski 
january 2016 by robertogreco
The Website Obesity Crisis
"Let me start by saying that beautiful websites come in all sizes and page weights. I love big websites packed with images. I love high-resolution video. I love sprawling Javascript experiments or well-designed web apps.

This talk isn't about any of those. It's about mostly-text sites that, for unfathomable reasons, are growing bigger with every passing year.

While I'll be using examples to keep the talk from getting too abstract, I’m not here to shame anyone, except some companies (Medium) that should know better and are intentionally breaking the web.

The Crisis

What do I mean by a website obesity crisis?

Here’s an article on GigaOm from 2012 titled "The Growing Epidemic of Page Bloat". It warns that the average web page is over a megabyte in size.

The article itself is 1.8 megabytes long."


Here's an almost identical article from the same website two years later, called “The Overweight Web". This article warns that average page size is approaching 2 megabytes.

That article is 3 megabytes long.

If present trends continue, there is the real chance that articles warning about page bloat could exceed 5 megabytes in size by 2020.

The problem with picking any particular size as a threshold is that it encourages us to define deviancy down. Today’s egregiously bloated site becomes tomorrow’s typical page, and next year’s elegantly slim design.

I would like to anchor the discussion in something more timeless.

To repeat a suggestion I made on Twitter, I contend that text-based websites should not exceed in size the major works of Russian literature.

This is a generous yardstick. I could have picked French literature, full of slim little books, but I intentionally went with Russian novels and their reputation for ponderousness.

In Goncharov's Oblomov, for example, the title character spends the first hundred pages just getting out of bed.

If you open that tweet in a browser, you'll see the page is 900 KB big.
That's almost 100 KB more than the full text of The Master and Margarita, Bulgakov’s funny and enigmatic novel about the Devil visiting Moscow with his retinue (complete with a giant cat!) during the Great Purge of 1937, intercut with an odd vision of the life of Pontius Pilate, Jesus Christ, and the devoted but unreliable apostle Matthew.

For a single tweet.

Or consider this 400-word-long Medium article on bloat, which includes the sentence:

"Teams that don’t understand who they’re building for, and why, are prone to make bloated products."

The Medium team has somehow made this nugget of thought require 1.2 megabytes.

That's longer than Crime and Punishment, Dostoyevsky’s psychological thriller about an impoverished student who fills his head with thoughts of Napoleon and talks himself into murdering an elderly money lender.
Racked by guilt, so rattled by his crime that he even forgets to grab the money, Raskolnikov finds himself pursued in a cat-and-mouse game by a clever prosecutor and finds redemption in the unlikely love of a saintly prostitute.

Dostoevski wrote this all by hand, by candlelight, with a goddamned feather."



"Everyone admits there’s a problem. These pages are bad enough on a laptop (my fan spun for the entire three weeks I was preparing this talk), but they are hell on mobile devices. So publishers are taking action.

In May 2015, Facebook introduced ‘Instant Articles’, a special format for news stories designed to appear within the Facebook site, and to load nearly instantly.

Facebook made the announcement on a 6.8 megabyte webpage dominated by a giant headshot of some dude. He doesn’t even work for Facebook, he’s just the National Geographic photo editor.

Further down the page, you'll find a 41 megabyte video, the only way to find out more about the project. In the video, this editor rhapsodizes about exciting misfeatures of the new instant format like tilt-to-pan images, which means if you don't hold your phone steady, the photos will drift around like a Ken Burns documentary.

Facebook has also launched internet.org, an effort to expand Internet access. The stirring homepage includes stories of people from across the developing world, and what getting Internet access has meant for them.
You know what’s coming next. When I left the internet.org homepage open in Chrome over lunch, I came back to find it had transferred over a quarter gigabyte of data.

Surely, you'll say, there's no way the globe in the background of a page about providing universal web access could be a giant video file?

But I am here to tell you, oh yes it is. They load a huge movie just so the globe can spin.

This is Facebook's message to the world: "The internet is slow. Sit and spin."

And it's not like bad connectivity is a problem unique to the Third World! I've traveled enough here in Australia to know that in rural places in Tasmania and Queensland, vendors treat WiFi like hundred-year-old brandy.

You're welcome to buy as much of it as you want, but it costs a fortune and comes in tiny portions. And after the third or fourth purchase, people start to look at you funny.

Even in well-connected places like Sydney, we've all had the experience of having a poor connection, and almost no battery, while waiting for some huge production of a site to load so we can extract a morsel of information like a restaurant address.

The designers of pointless wank like that Facebook page deserve the ultimate penalty.
They should be forced to use the Apple hockey puck mouse for the remainder of their professional lives. [shouts of horror from the audience]

Google has rolled out a competitor to Instant Articles, which it calls Accelerated Mobile Pages. AMP is a special subset of HTML designed to be fast on mobile devices.

Why not just serve regular HTML without stuffing it full of useless crap? The question is left unanswered.

The AMP project is ostentatiously open source, and all kinds of publishers have signed on. Out of an abundance of love for the mobile web, Google has volunteered to run the infrastructure, especially the user tracking parts of it.

Jeremy Keith pointed out to me that the page describing AMP is technically infinite in size. If you open it in Chrome, it will keep downloading the same 3.4 megabyte carousel video forever.
If you open it in Safari, where the carousel is broken, the page still manages to fill 4 megabytes.

These comically huge homepages for projects designed to make the web faster are the equivalent of watching a fitness video where the presenter is just standing there, eating pizza and cookies.

The world's greatest tech companies can't even make these tiny text sites, describing their flagship projects to reduce page bloat, lightweight and fast on mobile.

I can't think of a more complete admission of defeat."



"The other vision is of the web as Call of Duty—an exquisitely produced, kind-of-but-not-really-participatory guided experience with breathtaking effects and lots of opportunities to make in-game purchases.

Creating this kind of Web requires a large team of specialists. No one person can understand the whole pipeline, nor is anyone expected to. Even if someone could master all the technologies in play, the production costs would be prohibitive.

The user experience in this kind of Web is that of being carried along, with the illusion of agency, within fairly strict limits. There's an obvious path you're supposed to follow, and disincentives to keep you straying from it. As a bonus, the game encodes a whole problematic political agenda. The only way to reject it is not to play.

Despite the lavish production values, there's a strange sameness to everything. You're always in the same brown war zone.

With great effort and skill, you might be able make minor modifications to this game world. But most people will end up playing exactly the way the publishers intend. It's passive entertainment with occasional button-mashing.

Everything we do to make it harder to create a website or edit a web page, and harder to learn to code by viewing source, promotes that consumerist vision of the web.

Pretending that one needs a team of professionals to put simple articles online will become a self-fulfilling prophecy. Overcomplicating the web means lifting up the ladder that used to make it possible for people to teach themselves and surprise everyone with unexpected new ideas

Here's the hortatory part of the talk:

Let’s preserve the web as the hypertext medium it is, the only thing of its kind in the world, and not turn it into another medium for consumption, like we have so many examples of already.

Let’s commit to the idea that as computers get faster, and as networks get faster, the web should also get faster.

Let’s not allow the panicked dinosaurs of online publishing to trample us as they stampede away from the meteor. Instead, let's hide in our holes and watch nature take its beautiful course.

Most importantly, let’s break the back of the online surveillance establishment that threatens not just our livelihood, but our liberty. Not only here in Australia, but in America, Europe, the UK—in every free country where the idea of permanent, total surveillance sounded like bad science fiction even ten years ago.

The way to keep giant companies from sterilizing the Internet is to make their sites irrelevant. If all the cool stuff happens elsewhere, people will follow. We did this with AOL and Prodigy, and we can do it again.

For this to happen, it's vital that the web stay participatory. That means not just making sites small enough so the whole world can visit them, but small enough so that people can learn to build their own, by example.

I don't care about bloat because it's inefficient. I care about it because it makes the web inaccessible.

Keeping the Web simple keeps it awesome."
pagebloat  webdesign  maciejceglowski  2015  webdev  participatory  openweb  internet  web  online  minecraft  accessibility  efficiency  aesthetics  cloud  cloudcomputing  amazonwebservices  backend  paypal  google  docker  websites  wired  theverge  medium  javascript  advertising  ads  acceleratedmobilepages  mobile  html  facebook  freebasics  jeremykeith  timkadlec  internet.org  facebookinstantarticles  maciejcegłowski 
january 2016 by robertogreco
Random color generator for JavaScript - randomColor.js
"WHY DOES THIS EX­IST?

There are lots of clever one-lin­ers for gen­er­at­ing ran­dom col­ors:

'#' + Math.floor(Math.random()*16777215).toString(16);
Un­for­tu­nately, this code nat­u­rally pro­duces murky greys, browns and greens.

ran­dom­Color gen­er­ates at­trac­tive col­ors by de­fault. More specif­i­cally, ran­dom­Color pro­duces bright col­ors with a rea­son­ably high sat­u­ra­tion. This makes ran­dom­Color par­tic­u­larly use­ful for data vi­su­al­iza­tions and gen­er­a­tive art."
javascript  color  colors  code  davidmerfield  webdev  webdesign 
november 2015 by robertogreco
Goodbye, Native Mobile Apps
"Why Atavist is betting on the web"



"Now, after nearly five years and 51 stories in The Atavist Magazine—plus tens of thousands of publishers and individuals producing their own stories on the Atavist platform—we’re discontinuing our native mobile apps."



"Ultimately, whatever small slice of attention we were gaining by having our app on some people’s home screens was outweighed by the technical, business, and design considerations that had piled up against it."



"Meanwhile, we’ve been able to find our readers on their devices— exactly how we’d hoped to when we started out, except in mobile browsers instead of in our app."
webapps  mobile  design  web  webdev  apps  evanratliff  jeffersonrabb  theatavist  publishing  epublishing  html5  javascript  magazines  howweread  nativeweb  webdesign 
september 2015 by robertogreco
WAY TO GO
"Description

Way to Go is an interactive experience for human beings between 5 and 105 years old. Maybe it lasts six minutes; maybe it lasts forever. Way to Go is ready for your web browser and willing to go VR, if you're Rift-y. It is like a grey squirrel balanced on a branch, fearless. Made by Vincent Morisset, Caroline Robert, Édouard Lanctôt-Benoit and the studio AATOAA, visionary creators of BLA BLA and Arcade Fire's award-winning Just A Reflektor. Produced by the National Film Board of Canada, co-produced by France Televisions, with a mesmerizing soundtrack by Philippe Lambert, it is a game and a solace and an alarm, a wake-up call to the hazards of today. At a moment when we have access to so much, and see so little, Way to Go will remind you of all that lies before you, within you, in the luscious, sudden pleasure of discovery.

Shorter Description

Way to Go is a walk in the woods. It is an astonishing interactive experience, a restless panorama, a mixture of hand-made animation, 360˚ video capture, music and dreaming and code; but mostly it is a walk in the woods, c'mon. Created by Vincent Morisset, Philippe Lambert, Édouard Lanctôt-Benoit & Caroline Robert (AATOAA). Produced by the NFB & France TV."



"Preface

YOU ARE ON YOUR WAY.
Yes, you are on your way.
It is not your first journey but Way to Go is the next journey before you. A walk through strange country - strange, familiar, remembered, forgotten. It is a restless panorama, a disappearing path, a game and a feeling. Way to Go is a small experience that gets bigger as you uncover it.
And the trees will change their shape, and the sky will widen.
And you will fly.
We go away every day. We plunge through the city, skate down roads, tunneling toward a destination without remembering the quests we are on. A journey is a collection of moments - we are here, we are here, we are here, and yet we miss these moments. A journey is a collection of choices - turn here, stop here, choose here, and yet we surrender these choices.
What if we quit surrendering? What if we didn't miss?
Here is a world enclosed in a screen. Here is an adventure. A landscape of leaves and wildflowers, teeming with hidden life. A garden and a wilderness, a wistful blink of dream. You are Jean Painlevé, Marco Polo, Maria Merian. You are Alice, Sonic, Osvaldo Cavandoli. You are a visitor, a cartoon of face and limbs, and you are going on a walk.
Using hand-made animation, music, 360° capture technology and webGL sorcery, Way to Go imagines a dream-world of journeys. Walk, run, fly; crouch in the grass and remember what's hidden all around. Slip like a rumour from one place into another; chase your shadow; listen to the slow pulse of the metronome, black-clad, following in your wake.
Are you alone? Are you not alone? Are you dreaming or awake? Can you ever reach the mountains?
Can you see what's here before you?
Set out through woods and fields, sunlight and aurora, grey and colours.
Set out, in deliberate lucid looking
and you'll find,
perhaps,
the present.

(Preface by Sean Michaels)"
games  storytelling  gaming  videogames  art  nfb  forest  aaotaa  javascript  html  html5  webgl  three.js  webaudioapi  vincentmorisset  philippelambert  édouardlanctôt-benoit  carolinerobert  nfbc 
february 2015 by robertogreco
New Minecraft Modding Software Revolutionizes the Way We Teach Kids Coding
"San Diego, Calif., December 17, 2004 -- A new e-learning software, developed by San Diego education start-up ThoughtSTEM, teaches K-12 students how to code by allowing them to write mods (“modifications”) to the popular video game, Minecraft. The software, called LearnToMod, was recently tested by over 1,000 Beta users and 100 teachers, and the final release of LearnToMod is slated for Jan. 15, 2015. ThoughtSTEM was co-founded by computer science Ph.D. students Stephen Foster and Sarah Esper.

LearnToMod, a software that allows users to learn programming inside of the popular computer game Minecraft, is now available to preorder for $30/year athttp://www.learntomod.com. The software will be delivered Jan. 15.

LearnToMod seeks to inspire a new generation of young programmers by allowing students to explore their favorite video game, Minecraft, in a new way. The software allows students to learn the fundamental concepts of programming while they add new features (called “mods”) to Minecraft.

“Students have been coming into our classrooms for years raving about Minecraft. It dawned on us that the video game could be the perfect tool for teaching kids how to code,” said Foster, ThoughtSTEM CEO and lead software developer.

ThoughtSTEM has been teaching kids across the greater San Diego area how to code for the last two years. More recently, ThoughtSTEM has put their energy into developing LearnToMod, a software for teaching kids how to mod (i.e. code) Minecraft.

With LearnToMod, students learn how to code through hundreds of video tutorials and puzzles that teach them everything from how to create houses at the click of a button to how to design games within the game, like Portal or Tetris. Students can even create custom blocks and items within Minecraft by importing new textures. Soon, the software will allow students to program the artificial intelligence of entire “bot” armies.

“Kids all over the world love Minecraft. Unlike most other video games, Minecraft is completely moddable, which gives it the potential to be a great educational tool. Now, LearnToMod is teaching kids around the world to code through Minecraft,” said Esper, CTO of ThoughtSTEM. “In the past two months, over 100,000 lines of code have been written by LearnToMod Beta users. We’ve never seen kids so motivated to learn coding.”

For the last three months, over 1,000 kids from 44 countries have been Beta testing the LearnToMod software. LearnToMod is also being tested by over 100 school teachers in classrooms across the United States. “We’re developing tools to make the software really easy for teachers to use. We want to empower teachers to be able to create classroom activities and custom lesson plans inside of Minecraft,” said Foster. ThoughtSTEM is currently offering the software for free to low-income schools, encouraging them to teach coding in the classroom.

The LearnToMod software implements the best practices learned by the Computer Science Education research community in its coding tutorials and puzzles. LearnToMod developers, Foster and Esper, are PhDs specializing in Computer Science Education, with over 15 years of experience developing curriculum and writing software and games for teaching coding. The software aims to make the act of learning how to code as active and engaging as possible.

More information about LearnToMod can be found at: http://www.learntomod.com."

[via: https://twitter.com/andrewheumann/status/550736413751132162 ]
minecraft  kids  children  coding  modding  javascript  education  learning  2014  sandiego  software 
january 2015 by robertogreco
Rev Dan Catt: Still Blogging
"It's fun to see people (by which I mean people I track) talking about blogging. Andy here and Gina here, and others in Andy's comments.

I thought I'd jot down my angle.

• I'm tired of putting content on other people's platforms such as Medium, Flickr & Tumblr because I'm now never quite sure when it'll all go bottom up with me scrabble to get my content back out. Instead I'm scrabbling now, slowly going back through my archive and converting posts to markdown and importing images from Flickr. You can see just how far I haven't got by the cube placeholder images at /root.

• No analytics, no tracking, no cookies. I don't want to help Google track people around the web just so I can see how few hundreds of people viewed the site today. Removing the tracking is part of owning content. My audio is still on SoundCloud which drags GA cookies in with it when I post it here, same with Vimeo/YouTube videos. It's getting easier to self-host that kind of stuff, I just haven't had the time yet. So, no javascript on the page, no css/images/js from external sites is the goal. As I'm still interested in where people come from I sometimes pop onto the server to run goaccess to view referrers.

• Blogging has changed, twitter and Medium have altered the need to blog how we used to. I've re-jigged my blog to be the historic record my future self will want. Hence why you get presented with the current month, rather than traditional reverse chronological posts. I'm designing it for a future when at the end of the year I can push a button and it'll toss all my content into a book, divided up into months.

It's my own shoebox"
revdancatt  blogging  blogs  webdev  tracking  googleanalytics  medium  flickr  tumblr  content  adomainofone'sown  soundcloud  ownership  control  vimeo  youtube  css  images  javascript  2014  webdesign 
october 2014 by robertogreco
uilang
"a minimal, ui-focused programming language for web designers"
via:tealtan  css  design  javascript  ui  webdev  webdesign  html  uiland 
september 2014 by robertogreco
Shorthand.js by splatcollision
"A lightweight, natural language syntax for describing interactive behaviors for the web.

Shorthand is intended for quickly prototyping behaviors in HTML mockups. The idea is to quickly test out user interactions without investing tons of time in custom JavaScript programming. Shorthand should get you 80% of the way to a functional 'web thang', without the headaches of jQuery spaghetti code.

Shorthand statements all follow a simple basic syntax:

(selector) should (do an action) on (user interaction)"

[See also: https://www.edit-room.com/screens ]
via:tealtan  webdev  webdesign  web  javascript  hyml 
september 2014 by robertogreco
Progressive enhancement - Wikipedia
"Progressive enhancement is a strategy for web design that emphasizes accessibility, semantic HTML markup, and external stylesheet and scripting technologies. Progressive enhancement uses web technologies in a layered fashion that allows everyone to access the basic content and functionality of a web page, using any browser or Internet connection, while also providing an enhanced version of the page to those with more advanced browser software or greater bandwidth.

"Progressive Enhancement" was coined by Steven Champeon in a series of articles and presentations for Webmonkey and the SXSW Interactive conference between March and June 2003.

Specific CSS techniques pertaining to flexibility of the page layout accommodating different screen resolutions is recently being discussed under the name of "Responsive Web Design". .net Magazine chose Progressive Enhancement as #1 on its list of Top Web Design Trends for 2012 (Responsive design was #2).



The strategy is an evolution of a previous web design strategy known as "graceful degradation", wherein designers would create Web pages for the latest browsers that would also work well in older versions of browser software. Graceful degradation was supposed to allow the page to "degrade", or remain presentable even if certain technologies assumed by the design were not present, without being jarring to the user of such older software. In practice, graceful degradation has been supplanted by an attitude that the end user should "just upgrade".[citation needed] This attitude is due to time and budget constraints, limited access to testing alternate browser software, as well as the widespread belief that "browsers are free". Unfortunately, upgrading is often not possible due to IT department policies, older hardware, and other reasons. The "just upgrade" attitude also ignores deliberate user choices and the existence of a variety of browser platforms; many of which run on handhelds or in other contexts where available bandwidth is restricted, or where support for sound or color and limited screen size, for instance, are far different from the typical graphical desktop browser. There is also a large group of Internet users unaware or uncaring about the features of the browser."
accessibility  css  design  javascript  webdesign  webdev  2003  stevechampeon 
august 2014 by robertogreco
gSchool — Galvanize
"Learn from the best and launch a new path through gSchool's immersive developer training programs, or gain an edge with a gSchool workshop."



"We turn smart, driven beginners into marketable, contributing members of development teams over the course of our 24-week long developer training programs. Our full stack curriculum includes Ruby on Rails, Sinatra, Javascript, CSS3, HTML5, Responsive Design, Database, APIs, Version Control, and Test Driven Development - but our main focus is Rails."

[via: https://vimeo.com/103559084 ]
colorado  sanfrancisco  coding  education  gschool  ruby  rubyonrails  javascript  css3  html5  responsivedesign  development  programming  responsivewebdesign 
august 2014 by robertogreco
Old School Color Cycling with HTML5 | EffectGames.com
"Anyone remember Color cycling from the 90s? This was a technology often used in 8-bit video games of the era, to achieve interesting visual effects by cycling (shifting) the color palette. Back then video cards could only render 256 colors at a time, so a palette of selected colors was used. But the programmer could change this palette at will, and all the onscreen colors would instantly change to match. It was fast, and took virtually no memory. Thus began the era of color cycling.

Most games used the technique to animate water, fire or other environmental effects. Unfortunately, more often than not this looked terrible, because the artist simply drew the scene once, picked some colors to be animated and set them to cycle. While this technically qualified as "color cycling", it looked more like a bad acid trip. For an example, just look at the water in this game.

However, there was one graphic artist who took the technique to a whole new level, and produced absolutely breathtaking color cycling scenes. Mark J. Ferrari, who also illustrated all the original backgrounds for LucasArts Loom, and some for The Secret of Monkey Island, invented his own unique ways of using color cycling for envrironmental effects that you really have to see to believe. These include rain, snow, ocean waves, moving fog, clouds, smoke, waterfalls, streams, lakes, and more. And all these effects are achieved without any layers or alpha channels -- just one single flat image with one 256 color palette.

Unfortunately the art of color cycling died out in the late 90s, giving way to newer technologies like 3D rendering and full 32-bit "true color" games. However, 2D pixel graphics of old are making a comeback in recent years, with mobile devices and web games. I thought now would be the time to reintroduce color cycling, using open web technologies like the HTML5 Canvas element.

This demo is an implementation of a full 8-bit color cycling engine, rendered into an HTML5 Canvas in real-time. I am using 35 of Mark's original 640x480 pixel masterpieces which you can explore, and I added some ambient environmental soundtracks to match. Please enjoy, and the source code is free for you to use in your own projects (download links at the bottom of the article)."

[See also: http://www.effectgames.com/demos/canvascycle/ ]
animation  graphics  html5  javascript  colorcycling  via:vruba  canvas  8bit 
august 2014 by robertogreco
Learn JavaScript & jQuery - a book about interactive front-end web development
"This is not your average programming book.
We understand that all kinds of people build websites these days (and that they don’t all have a degree in computer science).

So, if you want to use JavaScript to make your web pages more interactive, interesting, and usable, we can help. Even if you have never done any programming."
books  javascript  coding  webdev  jquery  howto  programming  via:maxfenton  webdesign 
july 2014 by robertogreco
Leaflet - a JavaScript library for mobile-friendly maps
"Leaflet is a modern open-source JavaScript library for mobile-friendly interactive maps. It is developed by Vladimir Agafonkin with a team of dedicated contributors. Weighing just about 33 KB of JS, it has all the features most developers ever need for online maps.

Leaflet is designed with simplicity, performance and usability in mind. It works efficiently across all major desktop and mobile platforms out of the box, taking advantage of HTML5 and CSS3 on modern browsers while still being accessible on older ones. It can be extended with a huge amount of plugins, has a beautiful, easy to use and well-documented API and a simple, readable source code that is a joy to contribute to."

[via: http://xkcd-map.rent-a-geek.de/ of http://xkcd.com/1110/ ]
edg  javascript  maps  mapping  leafletjs  webdev  xkcd  webdesign 
may 2014 by robertogreco
OriDomi - origami for the web
"The web is flat, but now you can fold it up.

open source JavaScript library by Dan Motzenbecker"
css  css3  javascript  3d  webdev  danmotzenbecker  webdesign 
december 2013 by robertogreco
Visualizing Variation: Animated Variants
"An important early claim made for digital scholarly editions was that they don't force editors and readers into choosing one variant over another. Instead of creating an implicit or explicit hierarchy of rejected variants subordinated to a single, supposedly authoritative reading, it was thought that digital editions could represent variants dynamically, presenting their ambiguity to readers not as a problem to solve, but as a field of interpretive possibility. Very few digital editions, however, have realized this possibility in their interfaces. One thing a digital visualization can do is make a virtue of ambiguity in ways that print cannot, combining the elements of time and motion to represent variants in ways that challenge the idea that texts are fixed and immutable.

This group of prototypes uses animation to cycle between different textual variants, presenting them as a field of possibilities to readers, and hopefully inviting readers to consider the evidence for and consequences of different possibilities. Animated variants also drive home the simple yet unsettling point that textual transmission is more often a matter of change than fixity: texts sometimes change even when readers aren't looking.

The Animated Variants visualization was inspired partly by debates in Shakespearean editorial theory and partly by born-digital poetry, especially the early computer poems of bpNicol. Although the first prototype of this visualization was developed with Shakespearean examples in mind, my plan is to generalize them to handle as many different kinds of variation as possible. The single prototype posted here will likely become a group of visualizations that handle many different kinds of textual variation, including variants in words, phrases, lineation, stage directions, and manuscript revisions. For now I have posted a simple first version that cycles between variant words and phrase, as shown in the box above."

[via: http://snarkmarket.com/2013/8153#comment-10614 ]
alangaley  text  variations  language  xml  webdev  css  javascript  change  flux  plasticity  translation  expandingtext  digitalsertão  animatedvariants  stackingwords  auditiontext  webdesign 
november 2013 by robertogreco
Annotator - Annotating the Web
"The Annotator is an open-source JavaScript library and tool that can be added to any webpage to make it annotatable.

Annotations can have comments, tags, users and more. Morever, the Annotator is designed for easy extensibility so its a cinch to add a new feature or behaviour.

Check out the live demonstration or install it now."
via:litherland  javascript  webdev  annotation  jquery  tools  interface  webdesign 
october 2013 by robertogreco
Choc - Bret Victor's 'Learnable Programming' implemented in Javascript
"Choc is a tool for thinking powerful thoughts by stepping through code. It is an implementation of several ideas found in Bret Victor's Learnable Programming."
javascript  learning  programming  teaching  js  via:tealtan  edg  srg  coding  bretvictor  natemurray  arilerner 
september 2013 by robertogreco
Coder for Raspberry Pi
"Coder is a free, open source project that turns a Raspberry Pi into a simple platform that educators and parents can use to teach the basics of building for the web. New coders can craft small projects in HTML, CSS, and Javascript, right from the web browser."
raspberrypi  coder  google  googlecreativelab  html  css  javascript  teaching  learning 
september 2013 by robertogreco
D3.js - Data-Driven Documents
"D3.js is a JavaScript library for manipulating documents based on data. D3 helps you bring data to life using HTML, SVG and CSS. D3’s emphasis on web standards gives you the full capabilities of modern browsers without tying yourself to a proprietary framework, combining powerful visualization components and a data-driven approach to DOM manipulation."

[See also: http://bost.ocks.org/mike/ ]
data  javascript  visualization  graphs  mikebostock  d3  d3.js  html  webdev  css  datavisualization  webdesign 
july 2013 by robertogreco
Poem Viewer
"Poem Viewer is a web-based tool for visualizing poems in support of close reading. It is part of an on-going research project and is a work in progress. We welcome any comments, questions, or suggestions from your experience in using this tool. You can either start creating your own visualization for your chosen poem or have a look at a collection of sample visualizations that we have created."
poemviewer  poetry  poems  javascript  literature  visualization  notsurewhattothinkofthis 
july 2013 by robertogreco
iD
"iD is a new, friendly editor for OpenStreetMap. It offers newcomers an easy way into editing OSM and is intended to complement existing editing software."

[via: http://mapbox.com/openstreetmap/#live ]
javascript  mapping  openstreetmap  maps  osm  mapbox 
may 2013 by robertogreco
Map Projection Transitions
"By default, d3.geo will cut lines and polygons where they cross the antimeridian. This is usually appropriate for conic and cylindrical projections.

Projections with the same type of clipping are simple to transition using a weighted average of the source and target projections.

Based on Projection Transitions by Mike Bostock."

[See also: http://www.jasondavies.com/maps/ ]

[via: http://roomthily.tumblr.com/post/46302455340/map-projection-transitions ]
maps  mapping  projections  mikebostock  javascript  jasondavies  gis  coding 
march 2013 by robertogreco
slitscanner.js by Sha Hwang
"Slitscanner is a little piece of Javascript you can run as a bookmarklet to start, well, slitscanning videos online. This only works in the HTML5 video players so for Vimeo you will need to select "Switch to HTML5 Player" in the lower right on the video pages. For YouTube it's a little trickier, you can opt into the HTML5 test here, but they will still use the Flash Player for videos with ads."

[See also: http://shahwang.tumblr.com/ ]
shahwang  slitscanner  javascript  2013  bookmarklets  bookmarklet  video  images  youtube  vimeo  videos  time  timemergemedia  timemerge 
january 2013 by robertogreco
In-depth tutorials and articles on web design | Webdesigntuts+
"Webdesigntuts+ is a blog made to house and showcase some of the best web design tutorials and articles around. We publish tutorials that not only produce great results and interfaces, but explain the techniques behind them in a friendly, approachable manner.
Web design is a booming industry with a lot of competition. We hope that reading Webdesigntuts+ will help our readers learn a few tricks, techniques and tips that they might not have seen before and help them maximize their creative potential!"
typography  ux  javascript  css  html  howto  webdev  edg  srg  via:steelemaley  classideas  web  design  tutorials  webdesign 
october 2012 by robertogreco
Kartograph – rethink mapping
"Kartograph is a simple and lightweight framework for building interactive map applications without Google Maps or any other mapping service. It was created with the needs of designers and data journalists in mind.

Actually, Kartograph is two libraries. One generates beautiful & compact SVG maps; the other helps you to create interactive maps that run across all major browsers."

"Kartograph.py
A powerful Python library for generating beautiful, Illustrator-friendly SVG maps.

Kartograph.js
A JavaScript library for creating interactive maps based on Kartograph.py SVG maps."
webdev  framework  kartograph  via:jenlowe  dataviz  datavisualization  visualization  datavisualisation  javascript  python  mapping  maps  webdesign 
september 2012 by robertogreco
Benji Lanyado is a journalist, coder – and a glimpse of the future? | News Burger
"When I first heard about The Reddit Edit, I thought it was a nifty idea.

It takes Reddit’s functional, information-laden appearance and turns it into a streamlined, colourful depiction of the top trending stories. The top three stories are displayed in an easy-to-use side-scrolling interface, plucked from five popular subreddits: /r/worldnews, /r/politics, /r/technology, /r/science and /r/pics, plus the reddit.com homepage.

You might think a project like this would be the undertaking of a web developer, but it’s the brainchild of 28-year-old British journalist Benji Lanyado. The Reddit Edit was his final project while taking front-end web development classes with General Assembly, a New-York based digital education company who have recently expanded to London.

Benji, who writes for The Guardian and The New York Times, is part of a growing number of media types that are taking it upon themselves to know how to write and code to bring their content to life…"

[An interview follows.]
redditedit  programming  generalists  crossdisciplinary  classideas  glvo  srg  edg  howwework  filters  filtering  clayshirky  facebook  twitter  howweread  news  developers  interdisciplinary  interdisciplinarity  learning  nyc  html  css  javascript  generalassembly  rubyonrails  codecademy  kerouapp  nytimes  guardian  2012  media  reading  theredditedit  benjilanyado  via:russelldavies  reddit  careers  coding  journalism 
september 2012 by robertogreco
Fluid Images — Unstoppable Robot Ninja
One of the really solid criticisms lobbied against my Fluid Grids article for ALA was that all of my examples were pretty text-heavy. As a result, they all more or less ignored the issue I raised at the end of the essay: that working with non-fixed layouts can be more difficult once you introduce fixed-width elements into them. By default, an image element that’s sized at, say, 500px doesn’t exactly play nicely with an container that can be as large as 800px, but as small as 100px. What’s a designer to do?
webdev  responsive  layout  scale  design  webdesign  fluid  javascript  css  via:caseygollan  images  fluidimages  responsivedesign  responsivewebdesign 
september 2012 by robertogreco
Modernizr: the feature detection library for HTML5/CSS3
"Modernizr is a JavaScript library that detects HTML5 and CSS3 features in the user’s browser."
modernizr  javascript  webdesign  html  webdev  css  css3  html5 
august 2012 by robertogreco
Selectivizr - CSS3 pseudo-class and attribute selectors for IE 6-8
"selectivizr is a JavaScript utility that emulates CSS3 pseudo-classes and attribute selectors in Internet Explorer 6-8. Simply include the script in your pages and selectivizr will do the rest."
selectivizr  ie8  ie7  jquery  ie6  javascript  webdesign  webdev  css  css3 
august 2012 by robertogreco
CW&T; is an art and design studio.
"At CW&T;, we create multidisciplinary work in collaborative environments where we leverage technology and computing. With the latest tools and processes, we imagine near future possibilities and build them into reality.

Our design approach is to create lasting designs while questioning conventional thinking. In our quest to fulfill our goals, we favor minimal aesthetics, intuitive interfaces and over-engineered construction.

Che-Wei Wang is an artist, designer and architect. His work involves a wide range of disciplines and skills ranging from architecture, exhibition design, web design, interactive installations, robotics, sculpture and product design…

Taylor Levy is an artist and designer who works with various technologies. In her work, technology is broken apart and reconstructed to expose its otherwise opaque inner workings…

Many projects call for unique talents, so we assemble the best from our community of close collaborators that love working together."
glvo  javascript  java  openframeworks  processing  arduino  brooklyn  taylorlevy  che-weiwang  industrialdesign  id  architecture  design  art  nyc 
june 2012 by robertogreco
Google Blockly Lets You Hack With No Keyboard | Wired Enterprise | Wired.com
"Google has released a completely visual programming language that lets you build software without typing a single character.

Now available on Google Code — the company’s site for hosting open source software — the new language is called Google Blockly, and it’s reminiscent of Scratch, a platform developed at MIT that seeks to turn even young children into programmers.

Like Scratch, Blockly lets you build applications by piecing together small graphical objects in much the same way you’d piece together Legos. Each visual object is also a code object — a variable or a counter or an “if-then” statement or the like — and as you piece them to together, you create simple functions. And as you piece the functions together, you create entire applications — say, a game where you guide a tiny figurine through a maze…

From Google’s site, you can translate Blockly applications into existing languages, including Javascript; Dart, Google new take on Javascript, and Python."
dart  python  javascript  googlecode  scratch  edg  srg  2012  googleblocky  blocky  children  coding  visual  visualprogramminglanguage  programming  google  teaching 
june 2012 by robertogreco
water
Bret Victor is a genius. His recent CUSEC 2012 talk, Inventing on Principle, is one of the best talks I've ever seen. If you watch only one talk this year, make sure it's this one. I was blown away by his 'live coding' idea, but couldn't find any actual live examples, so I put together a quick demo using d3 and Ace. I 100% totally based it on Bret's idea - down to the clever book styling.

Super interesting. It would be even more interesting, imho, without the “clever book styling.”
via:waxy  javascript  via:litherland 
march 2012 by robertogreco
Learn Web Design, Web Development, and iOS Development - Treehouse
"What do you want to learn today?

Web Design: CSS, CSS3, Aesthetic Foundations, HTML, HTML5 and Responsive Web Design.

Web Development: HTML5, JavaScript and Introduction to Programming.

iOS: Build iPhone and iPad apps with Objective-C, Xcode and more."
webdev  howto  tutorials  coding  programming  ipad  iphone  ios  xcode  objective-c  responsivewebdesign  css3  css  srg  edg  javascript  html5  html  design  webdesign  webdevelopment  responsivedesign 
january 2012 by robertogreco
Play My Code | Play, Build and Share games online!
"Play My Code is an online platform for building, playing and distributing browser games. Powered by HTML5, you can build within the browser and embed your games anywhere."
browsergames  projectideas  teaching  learning  children  coding  classideas  srg  edg  programming  gamedev  html5  javascript 
december 2011 by robertogreco
Idiomatic Dart : Dart : Structured web programming
"Dart was designed to look and feel familiar if you're coming from other languages, in particular Java and JavaScript. If you try hard enough, you can use Dart just like it was one of those languages. If you try really hard, you may even be able to turn it into Fortran, but you'll be missing out on what's unique and fun about Dart.

This article will help teach you to write code that's uniquely suited for Dart. Since the language is still evolving, many of the idioms here are changing too. There are places in the language where we still aren't sure what the best practice is yet. (Maybe you can help us.) But here are some pointers that will hopefully kick your brain out of Java or JavaScript mode, and into Dart."
google  dart  idiomaticdart  2011  programming  coding  javascript  js  bobnystrom 
october 2011 by robertogreco
Let's assume that I am the stupidest person that ever lived. Explain to me what JavaScript is, what it does, and how a moron would go about learning it... - web design coding | Ask MetaFilter
"So Netscape said to a guy named Brendan, who worked at Netscape, "Please make us a programming language. Also, you have to call it Javascript.<br />
<br />
The "look like Java" mandate came early, but the name was "Mocha" from May 1995 until around September, IIRC, where it became "LiveScript" (to match Netscape's "LiveWire" server authoring CMS PHP-like offering with browser-based HTML editor). Only in early December did "Bill Joy, Founder" sign on the trademark license allowing Netscape to call it JavaScript. I heard he was a hunted man at Sun the next day…"<br />
<br />
[Related: http://www.metafilter.com/sideblog/archive/711 ]
javascript  history  sun  2011  billjoy  java  webdev  coding  via:mathowie  programming  web  webdesign 
september 2011 by robertogreco
Edit like an Ace - GitHub
"Ace is a code editor written in JavaScript. It powers Cloud9 IDE and, as of today, file editing on GitHub."
github  javascript  code 
august 2011 by robertogreco
Farmers’ Market API | Code for America
"I love getting my fruit and veggies from my local Farmer’ Market. Unfortunately, as a recent SF transplant I wasn’t sure how to find my local Farmers’ Market. A quick search led me to a USDA website which seemed to contain most of the markets in the country.<br />
<br />
Being an open data geek, I looked for an API. Finding none, I decided to make one. To do this, I:<br />
<br />
• Used the “Export to Excel” function to download the whole dataset.<br />
<br />
• Cleaned it up in Google Refine; normalized some fields, geocoded some records, added a geojson fields.<br />
<br />
• Uploaded it to a free couchdb instance.<br />
<br />
• Added the open source geocouch-utils CouchApp (which gives you a nice map out of the box).<br />
<br />
All of this was done in about an hour and at a cost of $0.<br />
<br />
So if you’re a developer who also likes fresh fruit & veg, build something on it. I’ll be down on Fillmore."
food  data  api  javascript  usda  farmersmarkets  maps  mapping 
august 2011 by robertogreco
Haunt the Border
"Border Haunt is an attempt to bring two different databases associated with the U.S.-Mexico border into contact with one another for the duration of one day. It is an invitation to join a temporary network of people from across the world and participate in an aesthetic and political experiment, in what I’m calling a border database collision.

The first of the two databases involved in the collision acts as an archive of migrants that have died while attempting undocumented crossings of the U.S.-Mexico border territory. These deaths are caused by the extreme environmental conditions of the desert, the anonymous violence of vigilantes, abusive law enforcement officers, and other causes. There are over 2000 entries in this database."

[via: http://bang.calit2.net/2011/07/border-haunt-a-database-collision/ ]
art  hacking  javascript  borders  mexico  us  database 
july 2011 by robertogreco
Paper.js
"Paper.js is an open source vector graphics scripting framework that runs on top of the HTML5 Canvas. It offers a clean Scene Graph / Document Object Model and a lot of powerful functionality to create and work with vector graphics and bezier curves, all neatly wrapped up in a well designed, consistent and clean programming interface."<br />
<br />
[via: http://prostheticknowledge.tumblr.com/post/7095795141/q-bertify-your-images-with-this-example-of ]
design  web  visualization  vector  graphics  html5  bezier  paperjs  javascript 
july 2011 by robertogreco
Am I Violating The DMCA By Visiting The NYTimes With NoScript Enabled? | Techdirt
"As we continue to explore the NY Times' bizarrely pointless paywall, it comes as no surprise that the wall itself is barely any wall at all. It's not even a fence. It's basically a bunch of fence posts, and someone screaming: "Pay no attention to your own eyes. There is a fence here, and you should go round the front & pay at the entrance... unless someone sent you here. Then walk on through."…But it gets even more bizarre when you discover that the "paywall" itself has apparently been written in javascript, meaning that when you do hit the wall, the full article you want to read actually loads in the HTML, it's just then blocked by some script asking you to pay up. That means it's even easier to remove than many had predicted (no need to even delete cookies or any such nonsense). In fact, that link above points people to NYTClean, a 4-line javascript bookmarklet, that makes it easy to remove the paywall w/ (literally) the click of a button, should you actually encounter it."
drm  paywall  nytimes  2011  javascript  html  workarounds  nytclean  dmca  addons  firefox  browser  browsers 
march 2011 by robertogreco
HOWTO: Native iPhone/iPad apps in JavaScript
"Until the recent language ban imposed by Apple, I didn't even know that you could write native apps for iPhone and iPad in JavaScript. (I must be the last person to figure this out; it's been possible since 2008!)

In case you're as late to the party as me, it turns out that you can get web apps to behave like native apps. In this article, I'll explain how to:

strip away the browser chrome (the url bar and button bar);
prevent viewport scrolling and scaling;
respond to multi-touch and gesture events;
use webkit CSS to get the iPhone OS look and feel;
cache the app so it runs without internet access;
get a custom icon on the home screen; and
have a splash screen load at the start.

If you want to put it in the app store, you can even package your web app as a "native" Objective-C app. (Although, why you'd want to subject yourself to the app store approval process when you don't have to is beyond me.)"
iphone  ipad  javascript  development  howto  css  html  via:migurski  ios  applications 
february 2011 by robertogreco
Polymaps
"Polymaps provides speedy display of multi-zoom datasets over maps, and supports a variety of visual presentations for tiled vector data, in addition to the usual cartography from OpenStreetMap, CloudMade, Bing, and other providers of image-based web maps.

Because Polymaps can load data at a full range of scales, it’s ideal for showing information from country level on down to states, cities, neighborhoods, and individual streets. Because Polymaps uses SVG (Scalable Vector Graphics) to display information, you can use familiar, comfortable CSS rules to define the design of your data. And because Polymaps uses the well known spherical mercator tile format for its imagery and its data, publishing information is a snap."
stamen  simplegeo  mapping  maps  visualization  javascript  gis  geo  polymaps  tiles  cartography  cloudmade  osm  openstreetmap  bing 
august 2010 by robertogreco
MiniApps - HTML5 apps for Apple iOS, Google Android & other mobile platforms
"All apps are free and open source. MiniApps does not use any in–app third–party advertisements. Help keep it that way and show a little love using Flattr."
iphone  ipad  applications  ios  android  html5  html  ipodtouch  javascript  mobile  mobileweb  webapp  webdev  development  software  web  webdesign 
july 2010 by robertogreco
WKTouch - Multi-touch JavaScript plugin for Apple iOS - MiniApps Blog
"I've just released a little JavaScript plugin called WKTouch up on Google Code. It's a tiny plugin for Apple's iOS Safari browser, enabling multi–touch drag, scale and rotate on HTML elements."
html5  via:robinsloan  touch  webdesign  webdev  javascript  mobile  multitouch  iphone  ipad  html  development  ios 
july 2010 by robertogreco
Daring Fireball: Tynt, the Copy/Paste Jerks
"All of this nonsense — the attribution appended to copied text, the inline search results popovers — is from a company named Tynt, which bills itself as “The copy/paste company”.
daringfireball  usability  seo  spam  copypaste  attribution  javascript  webdev  publishing  wastingourtime  copyright  chrome  ads  internet  web  advertising  webdesign 
may 2010 by robertogreco
Google Font Directory
"The Google Font Directory lets you browse all the fonts available via the Google Font API. All fonts in the directory are available for use on your website under an open source license and served by Google servers.
google  fonts  typography  javascript  html5  html  webdev  api  css  design  webdesign  free  type  googlefonts 
may 2010 by robertogreco
Daring Fireball: PastryKit
"After installing the User Guide app to your home screen and launching it from there, there’s really very little to suggest that it isn’t a native iPhone application. No MobileSafari address bar at the top, no MobileSafari toolbar at the bottom. Scrolling is fast and has momentum. It even works perfectly offline, because the contents of the user guide are stored locally in a database using HTML5."
javascript  webapp  daringfireball  webdev  programming  development  iphone  mobile  html5  pastrykit  applications  scrolling  ios  webdesign 
december 2009 by robertogreco
SproutCore
"Deliver stunning desktop-class applications in any modern web browser without plugins."
via:preoccupations  webdesign  ajax  webdev  programming  javascript  html  ui  software  opensource  web 
october 2009 by robertogreco
Let's make the web faster - Google Code
"There are many ways to make websites run faster. In this section, you can discover performance best practices that real web professionals employ in their everyday work. These practices have improved the user experience for millions of users and we hope they are useful for other web developers."
google  webdev  webdesign  tips  speed  optimization  bestpractices  javascript  tutorial  css  html  code  programming  web  development  tutorials  performance  coding  php  design 
august 2009 by robertogreco
arc90 lab : experiments : Readability
"Reading anything on the Internet has become a full-on nightmare. As media outlets attempt to eke out as much advertising revenue as possible, we’re left trying to put blinders on to mask away all the insanity that surrounds the content we’re trying to read.
readability  plugin  bookmarklets  browsers  reading  distraction  attention  online  web  javascript  bookmarklet  plugins  usability  onlinetoolkit  clutter  filter  browser 
march 2009 by robertogreco
SitePen Blog » Touching and Gesturing on the iPhone
"Everyone who owns an iPhone (or who has been holding out for an iPhone 3G) is bound to be excited about a lot of the new things the device can finally do, particularly the introduction of third-party applications. But those of us in the web development community have been itching for something further still: good web applications on the iPhone. This means we need a suitable replacement for mouse events. And boy did we get them! Though at first the APIs seem a little sketchy, once you’ve learned them you should be able to do amazing things in your application."
iphone  applications  webapps  development  coding  javascript  mobile  programming  webdesign  multitouch  safari  ajax  gestures  touch  webdev  tutorial  webkit  design  via:tomc  ios 
february 2009 by robertogreco
YouTube - iphone processing
"A port of Processing based on javascript, Processing.js and a custom built canvas-object running on the iPhone." see also: http://processing.org/discourse/yabb_beta/YaBB.cgi?board=implementations;action=display;num=1212232494
iphone  processing  javascript  programming  hacks  interface 
july 2008 by robertogreco
Aza’s Thoughts » Blog Archive » ContextFree.js & Algorithm Ink: Making Art with Javascript
"When the simplicity of the one-line plotter went away, so did the delight at being so effortlessly generative—in a visual way—on the computer. ContextFree.js is a stab at making it easy again."
javascript  art  graphics  programming  coding  classideas  firefox  webapp  webdev  webdesign 
july 2008 by robertogreco
Apture • Apture.com
"Apture provides the first rich communication platform allowing publishers and bloggers to easily turn flat pages of text into multimedia experiences."
blogging  blogs  onlinetoolkit  multimedia  javascript  technology  portfolio  online  tools  webdesign  apture  via:cburell  webdev 
june 2008 by robertogreco
280 Slides [via: http://www.wait-till-i.com/2008/06/05/north280-bring-keynote-to-the-web/]
"280 North guys have released their very Keynote-esque presentation editor for the web. Have a play with it and especially check the key-commands and drag and drop support. The shape designer is also pretty nifty."
keynote  presentation  javascript  powerpoint  tools  onlinetoolkit  webapp  presentations  slideshow  online 
june 2008 by robertogreco
« earlier      
per page:    204080120160

Copy this bookmark:





to read