recentpopularlog in

robertogreco : webdev   520

« earlier  
to be
"Free expressive tools for online creation.
Formed by the thousands of artists who’ve made and own a growing collection of extraordinary work.

Camera
The to.be Camera app uncovers a fantastic digital world beneath the surface of reality. Choose from hundreds of animated backgrounds. Tap a few colors on the screen, and record a video – or enjoy a passing daydream on your screen.
http://to.be/camera

Fields
Fields are your space to collage the internet. Much deeply personal and wonderfully diverse work has been done in these fields, from the serene to the unhinged.
http://to.be/fields

Printshop
Use the best set of tools online to easily make t-shirts and other printed products. We work with amazing partners that deliver the finest quality products. All made in the USA.
http://to.be/printshop "

[via: https://www.are.na/block/736425 ]
art  collage  design  web  webdev  applications  onlinetoolkit  internet  online  cameras 
8 weeks ago by robertogreco
AMB 1
"An automatic mood board creator. Add images to a Dropbox folder and view them on the web instantly. Designed for unobstructed inspiration."

[via: https://www.are.na/block/736425 ]
webdev  dropbox  design  moodboards  online  onlinetoolkit  internet 
8 weeks ago by robertogreco
Are.na / Arrangement Collage
[also here:
https://github.com/dark-industries/dark-zine/blob/master/lukas_collage.md ]

[See also:
https://www.are.na/lukas-w/arrangement-collage ]

[via:
https://urcad.es/writing/new-american-outline/ ]

"In 2015, Frank Chimero wrote on the “Grain” of the Web, focusing on a web-native media that doesn’t try to fight the inherently rectangle-based HTML Document Object Model (DOM)—also shared with XML and XHTML. This remains true: any site that does not look rectilinear is usually just fooling you; strip the CSS and it’s just a pile of blocks. Perhaps tilted and stretched, or with the corners shaved off, but just a pile of blocks.

As McLuhan would have anticipated, this blocky model has substantial effects toward what web-native media looks like. Chimero documents this well. I’d like to add a psychological component, though, in that as an online culture, we’ve grown accustomed to block-based interfaces. We joke at Web 2.0’s desire to round over corners and balk at clunky Flash plugins; nonlinear, non-blocky interfaces are either salient or sore thumbs.

Native internet users consume media through HTML interfaces at an astounding pace; simple rectangles frame a continuous deluge of multimedia updates. In an age of both physical and digital abundance in the Western world, creation of new media from scratch requires ample justification. Acts of synthesis, archiving, compression, and remix are valuable tools for leveraging information otherwise lost to the unsorted heap. These verbs are ways to construct something new from pre-existing media objects, or at least finding some narrative or meaning within them.

A curator, classically, acts as composer and manager of (typically static) objects so as to convey narrative to a willing audience. The internet audience, however, expects more autonomy in the dynamic content they see. Self-selected content is simply a necessary tactic for navigating nearly limitless information. An explosion of digital “curation” caters to the desire, whether by user directly, tuned algorithms, or third-party human. This manifests when you select topics of interest on Quora and construct a twitter feed of only exactly the people you want. Going to a curated museum is now a relinquishing of control compared to typical digital art consumption, which comes mashed-up through various media platforms.

Even with stream moderation, the modern media viewer is accustomed to lack of coherence between adjacent content blocks. In your tumblr dashboard, a peer-reviewed journal article can sit immediately above an anonymously submitted shitpost. We don’t blink. In an arrangement of DOM blocks, each bit of media similarly carries its own context, history, and qualia. I posit we can effectively navigate our feeds not because we can rapidly jump between the context captured by each DOM block, but rather because we interpolate narrative and construct cohesion. Adjacency implies connection and synthesis, or, in the words of John Berger:
[An image reproduction] becomes itself the reference point for other images. The meaning of an image is changed according to what one sees immediately beside it or what comes immediately after it. (Ways Of Seeing)

Marius Watz, in a response on the New Aesthetic, writes on tumblr image culture: “Its art is juxtaposition: If we put this next to that and this other thing, surely a new understanding will emerge.” To be fair, there are uncountably many combinations that may be devoid of meaning—all I mean to point out is that a diptych is a third object, beyond the original two, with the possibility of value. Some find artistic practice in the form of a relentless stream of rectangles. People go nuts over releases of image dumps from Moodmail and JJJJound, and the Lost Image Desk is making professional practice of it.

(A scan of contemporary sculpture demonstrates that selection and arrangement of objects—often found or folk objects—is an ongoing trend. The viewer is trusted with finding meaning in the arrangement, selection, formal qualities, cultural context, and more in a relational tradition.)

HTML is perfectly built for image adjacency—a blank and infinite canvas, empowered by right-click “Copy Image Address.” Our expansive tumblrs and pinterest boards act as collected and performed narratives, collages of found digital media.
[Traditional] collages, […] were probably laid out carefully, aided by facsimiles, white-out, and tape, existed alongside the book, rather than being subsumed or created through the process of publishing and distribution, as is often the case with internet ‘collage’. Computers conceal distance; their collage move consists of juxtaposing elements that might be stored hundreds or thousands of miles apart, giving an illusion of spatial continuity. (Seth Price, Teen Image)

Traditional art collage used the intrigue and power in composing elements pulled from diverse sources. Meaning constructed by selection, editing, and combination. The HTML collage, however, is copy-pasted. What is the HTML-native collage?

I call it the “Arrangement Collage”—rectangular, transcontextual compositions of, ostensibly, found media. The arrangement collage does less work for the viewer than traditional collage: elements are kept fully intact rather than trimmed for blended. The composition often mitigates interaction between elements and instead celebrates raw adjacency.
When the historical avant-garde used valorized cultural objects such as the Mona Lisa or a violin, it profaned, overpowered, and destroyed them before going on to aestheticize them. In contrast, contemporary art uses mass-cultural things virtually intact. (Boris Groys, On The New)

The arrangement collage, while easy to construct in print, is truly native to the web, in which all objects are, by default, level rectangles, context-switching is the norm, and media to compose with is bountiful.

Our feeds, plentiful in the digital landscape, help populate the arrangement collage. Tumblr, ostensibly a micro-blogging site, is largely used for image collection; FFFFound is legendary for its contextless stream of collected imagery (and as birthing the name for JJJJound, when Justin Saunders couldn’t get an account); and Buzzfeed publishes “articles” that are frankly just stacks of image macros. A proliferation of mindless image consumption concerns Bob Gill.
There’s nothing original. ‘The Culture’ is the great mass of images and ideas which bombard us every day, and therefore shape the way we think visually. Only by recognising The Culture’s presence and its power, can designers move away from the clichés it promotes.

Irrefutably, the images we consume affect how we think, and what we can imagine. Gill’s words should be considered, and the internet-native should stay aware of “the clichés” promoted. Gill encourages “first-hand” research, but this points at a cultural gap—there is no line between reality and the internet; “first-hand” research takes place on the social web. In-person discussion and close examination of physical objects can be romanticized, but it should not detract from the fact that meaningful discussion and critical consumption can happen in a digital landscape as well.

Of deeper concern is the stripping of value from imagery in overabundance. Edition MK’s 2010 DDDDoomed (the name, I assume, another reference to FFFFound) gets at the kernel of this problem: Image Aggregators (“IAs”—such as JJJJound and other blogs), which typically present images contextless alongside hundreds of others, can strip imagery of its power. IAs do work that is weaker, semiotically, than traditional collage, and less organized than archiving (which is often a process of attaching or generating metadata, whereas IAs frequently remove it). Images that find political power within a context are reduced to purely aesthetic objects in the stream. If you are a tumblr fiend, this very likely rings true: the multitude of streams filled with gorgeous scenery, motivational quotes, and supermodel women quickly reduce this imagery to banality and objectification.
We [distance ourselves] from our critical faculties as we slide into models of passive spectatorship that reinforce our passivity by promoting a one-way mode of cultural consumption. […] Continuous over-stimulation leads to desensitisation. (Peter Buwert, “Defamiliarization, Brecht and Criticality in Graphic Design” in Modes of Criticism 2: Critique of Method)

The arrangement collage might serve as a tool in this battle against desensitization. In Buwert’s essay, referenced above, he describes how Brecht’s famous defamiliarization of the theater encouraged “a condition of active critical spectatorship within the audience.” DDDDoomed is lamenting the supposed death of this critical spectator, replaced with the numb and passive viewer. Buwert is less concerned with context/lessness than Edition MK, and instead focuses on familiarity.

There are valiant efforts towards an inclusion of context and metadata with online imagery, but it is not built into the structure of the internet. Flickr and twitter use image covers to dissuade copy-pasting (circumnavigable by screen-shotting) and Mediachain attempts to inextricably tie media to metadata using blockchain methods. As of writing, however, the JPG is not going anywhere, and the ease of downloading and re-uploading an image far surpasses digging to find its source. Entropy is not on our side, and Google’s reverse image search will never be quite fast or comprehensive enough to keep up.

Walter Benjamin might lament the loss of contextual sensitivity, as it comes intertwined with a loss of “aura.” The authenticity that drives Benjamin’s aura is dependent on the idea of an original—which, in internet ecosystems, simply isn’t a relevant concept, as the original and reproduction can be… [more]
lukaswinklerprins  2016  frankchimero  arrangementcollage  web  online  feeds  juxtaposition  canon  curation  collections  tumblr  html  webdev  form  imagery  images  webnative  decomposition  composition  peterbuwert  aggregation  ffffound  justinsaunders  bobgill  sethprice  moodmail  lostimagedesk  waysofseeing  johnberger  dom  xml  xhtml  marshallmcluhan 
8 weeks ago by robertogreco
Scratching the Surface — 102. Laurel Schwulst
"Laurel Schwulst is a designer, writer, teacher, and webmaster. She runs an independent design practice in New York City and teaches in design programs at Yale and Rutgers. She previously was the creative director for The Creative Independent and a web designer at Linked By Air. In this episode, Laurel and Jarrett talk about how horses got her into graphic design, what websites can be, the potential of the peer-to-peer internet, and how writing and teaching influence her practice."

[Direct link to audio: https://soundcloud.com/scratchingthesurfacefm/102-laurel-schwulst ]
jarrettfuller  scratchingthesurface  laurelschulst  2018  interviews  design  web  online  internet  are.na  lynhejinian  mindyseu  decentralization  neilpostman  charlesweingartner  juliacameron  teachingasasubversiveactivity  teaching  education  learning  howwelearn  kameelahjananrasheed  research  archiving  cv  roombaghost  graphicdesign  websites  webdev  webdesign  p2p  beakerbrowser  decentralizedweb  dat  p2ppublishing  p2pweb  distributed 
january 2019 by robertogreco
The Creative Independent: How to make a website for your creative work
"A guide to getting your work on the internet so you can share it with others, written by Jason Huff and illustrated by Sean Suchara."



"If you’re a creative person living in the world today, people will expect to be able to find some examples of your work online. How you choose to put it there, though, is completely up to you.

I got started on the web in the early aughts when I created a gallery for my creative work. I call it a gallery because it was just that: a blank space with images in a row that linked to some projects I wanted to share with friends. Since then my site has evolved, disappeared, come back, and spawned other sites that express my ideas and identity online. Each evolution was a chance to share new work in a way that reflected how I wanted people to experience it.

I work on the web everyday. I help designers, artists, and galleries discover and create their online presence. And for seven years, I designed and led teams at Etsy, a platform that helps millions of creative humans around the world use the web to make an income from their craft. In all of my work, I’ve learned that every person brings their own body of knowledge and point of view when they create their own space online. The unique approaches that each individual brings to the experience are what make the internet an interesting place to explore.

Before digging into this guide, I recommend reading Laurel Schwulst’s essay, My website is a shifting house next to a river of knowledge. What could yours be? It’s a great sister piece to this more practical guide, and provides many poetic explorations of the website format. Like Laurel mentions in her essay, “Artists excel at creating worlds.” I hope this guide will help you start creating yours.

— Jason Huff"
webdesign  webdev  howto  websites  seansuchara  jasonhuff  art  glvo  projectideas  laurelschwulst  morehshinallahyari  petracortright  americanartist  ingridburrington  damonzucconi  jennyodell  seokhoonchoi  tomjennings  carlyayres 
january 2019 by robertogreco
Scratching the Surface — 104. Cab Broskoski and Chris Sherron
"Cab Broskoski and Chris Sherron are two of the founders of Are.na, a knowledge sharing platform that combines the creative back-and-forth of social media with the focus of a productivity tool. Before working on Arena, Cab was a digital artist and Chris a graphic designer and in this episode, they talk about their desire for a new type of bookmarking tool and building a platform for collaborative, interdisciplinary research as well as larger questions around open source tools, research as artistic practice, and subverting the norms of social media."

[direct link to audio:
https://soundcloud.com/scratchingthesurfacefm/104-cab-broskoski-and-chris-sherron ]
jarrettfuller  are.na  cabbroskoski  chrissherron  coreyarcangel  del.icio.us  bookmarkling  pinterest  cv  tagging  flickr  michaelcina  youworkforthem  davidbohm  williamgibson  digital  damonzucconi  stanleykubrick  stephaniesnt  julianbozeman  public  performance  collections  collecting  research  2000s  interview  information  internet  web  sharing  conversation  art  design  socialmedia  socialnetworking  socialnetworks  online  onlinetoolkit  inspiration  moodboards  graphicdesign  graphics  images  web2.0  webdesign  webdev  ui  ux  scratchingthesurface  education  teaching  edtech  technology  multidisciplinary  generalists  creative  creativitysingapore  creativegeneralists  learning  howwelearn  attention  interdisciplinary  crossdisciplinary  crosspollination  algorithms  canon  knowledge  transdisciplinary  tools  archives  slow  slowweb  slowinternet  instagram  facebook 
january 2019 by robertogreco
txt.fyi
"This is the dumbest publishing platform on the web.

Write something, hit publish, and it's live.

There's no tracking, ad-tech, webfonts, analytics, javascript, cookies, databases, user accounts, comments, friending, likes, follower counts or other quantifiers of social capital. The only practical way for anyone to find out about a posting is if the author links to it elsewhere.

But it is legible, no-nonsense static hypertext, good for short stories, not-short-enough tweets and adventures and all your numbers station or internet dead drop needs. Here you can scream into the void and know the form of your voice is out there forever.

Search engines are instructed not to index posts and I'll do my best to make sure this isn't used as a tool by spammers or other abusers. Nonetheless, posting will be turned off if anything bad grows out of it.

Use basic Markdown to format posts: #header, **bold**, *italic*, `code`, >quote, and hyperlinks in the format [link](http://example.com). Try !hacker and !professor and !timestamp too.

Be sure to email and tell me how to make it better.

Many thanks go to Ken Snider, @zemnmez, Ben Overmyer, Johannes Kröger and the others.

Long live the independent web!

Rob Beschizza | beschizza.com | @beschizza"
internet  publishing  onlinetoolkit  web  webdev  simplicity  robbeschizza  via:ayjay 
january 2019 by robertogreco
Keynote Extractor
"A better HTML export option for Apple Keynote.

Extract your slides and notes to an easily modifiable HTML file, using this super easy drag 'n drop application for macOS."
tools  keynote  mac  osx  html  webdev 
december 2018 by robertogreco
Lesspod: Serverless Websites
"Lesspod lets anyone build and deploy website+blog combination to serverless platforms (starting with Firebase). Key benefits:

• Super fast page load times.
• Infinite scalability of the cloud.
• No servers to manage or related problems.
• Free forever hosting! (for 99% websites)

This is a serverless website hosted freely on Firebase."
webdev  webdesign 
november 2018 by robertogreco
enoki
"An experimental platform tool for peer-to-peer publishing

Free
Culture wants to be free. No monthly hosting fees or billing to keep up with.

Decentralized
Instead of being confined to a centralized platform, publish directly with Dat.

Offline first
No internet? No problem. Sync changes automatically when reconnecting.

Own your content
This is a tool! Your content stays with you, not a greedy platform.

Archival
Easily go back in time and revert to previous versions of your site whenever!

Open source
Built with open source projects; released as an open source project."
enoki  p2p  publishing  web  online  internet  webdev  webdesign  cms  free  opensource  archives  archival  offline  decentralization  beakerbrowser  dat  p2ppublishing  decentralizedweb  p2pweb  distributed 
october 2018 by robertogreco
The Creative Independent: On exploring how to be online in radical ways [interview with Tara Vancil, co-creator of Beaker Browser]
"Web developer Tara Vancil discusses the peer-to-peer web, the current state of self-publishing, and the future of the internet."


"[Q] I love that Beaker has a built-in editor. There’s this all-in-one feel to it where you can browse and publish websites from the browser. I was curious what self-publishing means for you and why it’s important?

[A] Well, there’s this myth floating around on the web that the very first web browser, it was called WorldWideWeb, made by Tim Berners-Lee actually had an editor built into it. Now, I’ve never been able to 100% confirm this with him, or anybody, but there’s kind of just the shared history that goes around on the web, so I’m willing to believe it. When I found that out, it was really interesting because we had been building the early prototype of Beaker and it was quite different from what it is now. It did have a button that let you create a website from the browser, so self-publishing was a part of Beaker very early on. But we didn’t fully understand how important facilitating self-publishing would be. It was fairly recently that we decided to put in an editor. We thought it would be too much work to maintain, we thought people wouldn’t care, we thought they’d prefer to use their own editors. And then one day, we just realized like, “You know what? No, a browser really should help people participate in the web.”

So self-publishing, for me, is not necessarily about owning your content. It’s not all about enabling creativity. There are other tools that enable creativity. I think it’s about creating opportunities for the widest swath of people to participate on the web. I think right now, there are so many barriers that can pop up at any given moment when you decide, “I want to make an app, I want to make a game, I want to publish my portfolio, or I want to create an interactive art piece.” With Beaker, self-publishing is about reducing as many of those barriers as possible, so that literally everybody can have some hope of meaningfully participating on the web. Because why not? That’s what the web is. It’s this really strange thing.

I like to call the web humanity’s shared language. We’ve all come together, by some miracle, as a society to define a set of rules and technical standards about how we will communicate, how our computers will communicate with each other, and people all over the world use this. I mean, that’s pretty miraculous that we’ve managed to do that. So why shouldn’t everybody be able to build stuff on it, and share things on it? It seems really sad that right now that’s not the case, and I think it’s also boring.

[Q] There seems to be a general feeling that HTTP doesn’t provide a productive space any longer. Recently there’s been a lot of interest in going offline or just slowing down. I wanted to get your thoughts on the offline first movement and if you align yourself with it?

[A] Offline first is a funny concept to me because it’s rooted in both very corporate ideology and very anti-corporate ideology. So there’s one meaning for offline first, I think it was coined by Google, and this was a way for building applications such that low-power devices in places that have really bad connectivity could cache an application’s or website’s assets so that it can still function well. I think this is an honorable effort to build applications with the expectation that we don’t live in an equitable world, but we have to remember that a corporation like Google is motivated to do that because they want to sell more devices, and they want to further the reach of Gmail and their other tools.

And then there’s the other side of the movement, where offline first means something very different to another group of people. If you’ve heard of Secure Scuttlebutt, it’s a peer-to-peer online friends space. It’s a place for people to post content and share things with their friends without having to connect through something like Twitter or Facebook. And a lot of the folks that participated there in the early days were really interested in finding ways to live a little more independently, to maybe not depend entirely on the electrical grid, or to be able to live on a boat, or to maintain their own garden. I think that reflects an interest in slowing down, and a reaction to the speed of consumption that the web of today demands of us.

So at the end of the day, I think offline first—by both definitions—is rooted in the observation that we don’t live in an equitable world, and modern applications do not serve everybody. They don’t serve every kind of lifestyle. I’m definitely interested in living in a home with electricity and modern amenities but I’m also really interested in doing that responsibly, and I care a lot about my own sanity and other people being able to maintain their sanity in this hyper-connected world. I think a lot of us are perhaps exploring how we do that for the long-term. So I like being online and I want to continue being online, but I think looking to these communities that are exploring how to be online in radical ways, is really important.

[Q] Beaker is a good example of that. In my own exploration of the peer-to-peer web, I’ve needed to either be sent a link directly from somebody, or be in connection with the HTTP web to find websites on the p2p web. I’m curious what the longer-term goals are? Is it sort of like in tandem with the current web, or is the goal to replace HTTP with peer-to-peer protocols?

[A] Yeah, there’s an interesting effect on the peer-to-peer web where you kind of have to bootstrap your experience somehow. You either have to have a chat open with a friend so that you can send links between each other, or you need to have a curated list of websites and projects that you want to visit. And interestingly, I think that’s a problem that the HTTP web suffers from as well. It’s an aggregation problem. If you think back to the early days of the HTTP web, someone—or some company—had to go out there and crawl the web, and collect the links that they found, and then publish them somewhere. That’s just a fact of how networks work. It’s hard to aggregate content independently.

So I think what that means is that if the peer-to-peer web is going to become a part of the web as we know it, then so are search engines and aggregators. And maybe those search engines will use HTTP just because it’s easier for that purpose. Maybe not. I’m not sure that we need to replace HTTP entirely to fix what’s wrong with the web. I think we need to replace HTTP in cases where it encourages centralization of governance over our communities, and it discourages innovation and the ownership of our online experiences. That’s why I think it’s so important that people are able to publish their own websites, for example, because a website can be anything. It can be the place where you post your micro-blogs, like your tweets. It can be a place where you post blog posts, which is pretty obvious. It could be a place where you post photos or art projects, and I feel that the HTTP web makes it so difficult to do that right now. As a result, we’re cornered into the situation where we have to publish on Twitter, and Facebook, and Instagram. And that’s fine, those are pretty cool platforms, but they also constrain us, and I think we’re starting to understand the limits and the consequences of that.

[Q] It might be a positive thing that you can’t search the peer-to-peer web currently, in that it has to be such a personal connection where my friend will send me a link to a website. HTTP is a constant process of following links to other links. On the p2p web it’s more about accessing a page and then reading it to the end, and then maybe going offline after that.

[A] Yeah, there’s a certain finiteness to it, which is blissful at times. I’m not sure it’ll stay that way forever. There’s a lesson to be learned about how it feels to use the peer-to-peer web. I’ve found websites where I couldn’t believe I found them. It felt like I’d just stumbled upon a treasure. Like, “Wow, this person is out there and they’ve made this thing. I want to read everything they’ve posted,” and then that’s the end of it. It’s a really satisfying experience.

[Q] It also feels like you have to forget what you thought the web was when you’re approaching the p2p web. I find it pretty difficult to describe what the peer-to-peer web is, and I think maybe that’s not just me. It’s broad, it’s many different things, it’s multi-layered.

What does your ideal web look like?

[A] I want a web that I can build on. I love building on the web so much. To me, websites are my canvas. I grew up in a family that I think looked down on anything that smelled of creativity. I grew up hunting, watching football, and playing sports. There’s no creative exploration in that. I became exposed to the creative process fairly late in my life, and the canvas for me is websites. I love the feeling that I get when I sit down with a blank slate, and I know how to use the tools, I know how to wield HTML and CSS and bend it to my will. I want a web that is conducive to that, and I don’t want to just build standalone websites. I would love to build things that are meaningful to people, that have users, and then I want those users to be able to take what I’ve made and be able to shape it into something new.

On the web today, I feel like I can build something amazing, and I can go out and find people who want to use what I’ve built. But it’s a very rigid process. To build something, I first of all probably have to find investment because launching a service on the web, launching an app that’s actually going to get wide usage, is really, really expensive. So I think I want a web that makes that process cheaper, and distributes the cost of bandwidth and storage across its users. And then beyond that, I want a web that doesn’t try to lock down the experience of … [more]
beakerbrowser  taravancil  2018  publishing  self-publishing  online  internet  time  longevity  ephemeral  ephemerality  collaboration  technology  design  decentralization  radicalism  web  webdev  webdesign  seeding  p2p  peertopeer  http  dat  decentralizedweb  independence  hashbase  p2ppublishing  p2pweb  selfpublishing  distributed 
october 2018 by robertogreco
Brutalist Web Design
"Guidelines for Brutalist Web Design
Raw content true to its construction

• Content is readable on all reasonable screens and devices.
• Only hyperlinks and buttons respond to clicks.
• Hyperlinks are underlined and buttons look like buttons.
• The back button works as expected.
• View content by scrolling.
• Decoration when needed and no unrelated content.
• Performance is a feature.

What is Brutalist Web Design?

The term brutalism is often associated with Brutalist Architecture, however it can apply to other forms of construction, such as web design. This website explains how.

The term brutalism is derived from the French béton brut, meaning “raw concrete”. Although most brutalist buildings are made from concrete, we're more interested in the term raw. Concrete brutalist buildings often reflect back the forms used to make them, and their overall design tends to adhere to the concept of truth to materials.

A website's materials aren't HTML tags, CSS, or JavaScript code. Rather, they are its content and the context in which it's consumed. A website is for a visitor, using a browser, running on a computer to read, watch, listen, or perhaps to interact. A website that embraces Brutalist Web Design is raw in its focus on content, and prioritization of the website visitor.

Brutalist Web Design is honest about what a website is and what it isn't. A website is not a magazine, though it might have magazine-like articles. A website is not an application, although you might use it to purchase products or interact with other people. A website is not a database, although it might be driven by one.

A website is about giving visitors content to enjoy and ways to interact with you.

The design guidelines outlined above—and detailed below—all are in the service of making websites more of what they are and less of what they aren't. These aren't restrictive rules to produce boring, minimalist websites. Rather these are a set of priorities that put the visitor to your site—the entire reason your website exists—front and center in all things."
webdev  webdesign  brutalism  design  guidelines  web 
october 2018 by robertogreco
LOW←TECH MAGAZINE: How to Build a Low-tech Website?
"Our new blog is designed to radically reduce the energy use associated with accessing our content."



"Static Site…
Dithered Images…
Default typeface / No logo…
No Third-Party Tracking, No Advertising Services, No Cookies…"

[Update: See also:
https://www.fastcompany.com/90246767/the-future-of-web-design-is-less-not-more
https://walkerart.org/magazine/low-tech-magazine-kris-de-decker ]
webdev  webdesign  publishing  sustainability  web  online  internet  energy  low-techmagazine  lowtech  low-tech 
september 2018 by robertogreco
Dat Project - Welcome!
"A distributed data community
Dat is a nonprofit-backed data sharing protocol for applications of the future."
distributed  p2p  sharing  data  collaboration  beaker  hashbase  dat  beakerbrowser  webdev  webdesign  p2ppublishing  decentralizedweb  p2pweb 
august 2018 by robertogreco
itty.bitty
"Itty bitty sites are contained entirely within their own link. (Including this one!) This means they're...

💼Portable - you don't need a server to host them
👁Private - nothing is sent to–or stored on–this server
🎁Easy to share as a link or QR code
Itty bitty sites can hold about as much as a printed page, and there is a lot you can do with that:

✒️Compose poetry
🛠Create an app
🐦Bypass a 140 280 char limit
🎨Express yourself in ascii

Advanced HTML editing & sharing

Handcrafted HTML files - Drag one into the editor to convert it.

Using Codepen.io - Paste a codepen URL into the editor. Get started with a template or look at some samples.

Size Limits - While most sites support 2000 bytes, some can handle more.

Hosting - One simple way to host is to forward a domain. Just paste the itty.bitty url in the redirect.

Learn more about how it works"
webdev  html  urls  publishing  onlinetoolkit  internet  web 
july 2018 by robertogreco
Below the Surface - Archeologische vondsten Noord/Zuidlijn Amsterdam
"The archaeological project of the North/South metro line

Urban histories can be told in a thousand ways. The archaeological research project of the North/South metro line lends the River Amstel a voice in the historical portrayal of Amsterdam. The Amstel was once the vital artery, the central axis, of the city. Along the banks of the Amstel, at its mouth in the IJ, a small trading port originated about 800 years ago. At Damrak and Rokin in the city centre, archaeologists had a chance to physically access the riverbed, thanks to the excavations for the massive infrastructure project of the North/South metro line between 2003 and 2012.

Rivers in cities are unlikely archaeological sites. It is not often that a riverbed, let alone one in the middle of a city, is pumped dry and can be systematically examined. The excavations in the Amstel yielded a deluge of finds, some 700,000 in all: a vast array of objects, some broken, some whole, all jumbled together. Damrak and Rokin proved to be extremely rich sites on account of the waste that had been dumped in the river for centuries and the objects accidentally lost in the water. The enormous quantity, great variety and everyday nature of these material remains make them rare sources of urban history. The richly assorted collection covers a vast stretch of time, from long before the emergence of the city right up to the present day. The objects paint a multi-facetted picture of daily life in the city of Amsterdam. Every find is a frozen moment in time, connecting the past and the present. The picture they paint of their era is extremely detailed and yet entirely random due to the chance of objects or remains sinking down into the riverbed and being retrieved from there. This is what makes this archaeological collection so fascinating, so poetically breathtaking and abstract at one and the same time.

In the following pages the scope and methods of the excavations are explained with special reference to the special nature of the River Amstel as an archaeological site, the specific goals of the research at Damrak and Rokin and the digital processing of the hundreds of thousands of finds, resulting in the website belowthesurface.amsterdam and the catalogue Stuff which presents 11,279 photographs of finds of the North/South metro line archaeological project."
amsterdam  history  museums  archaeology  rivers  cities  webdev  archives  time  timelines  collections  classideas 
june 2018 by robertogreco
Micro.blog
"Today's social networks are broken. Ads are everywhere. Hate and harassment are too common. Fake news spreads unchecked.

There's a better way: a network of independent microblogs. Short posts like tweets but on your own web site that you control.

Micro.blog is a safe community for microblogs. A timeline to follow friends and discover new posts. Hosting built on open standards.

Use Micro.blog from the web or with native apps for iOS and macOS. Learn more about why I created Micro.blog."

[See also: "Why I created Micro.blog"
http://help.micro.blog/2015/why-i-created-this/ ]
via:ayjay  web  online  microblogs  onlinetoolkit  indieweb  socialnetworking  socialmedia  publishing  blogging  blogs  webdev  webdesign 
may 2018 by robertogreco
My website is a shifting house next to a river of knowledge. What could yours be? – The Creative Independent
"The web is what we make it

While an individual website could be any of those metaphors I mentioned above, I believe the common prevailing metaphor—the internet as cloud—is problematic. The internet is not one all-encompassing, mysterious, and untouchable thing. (In early patent drawings depicting the internet, it appears as related shapes: a blob, brain, or explosion.) These metaphors obfuscate the reality that the internet is made up of individual nodes: individual computers talking to other individual computers.

[image]

The World Wide Web recently turned 29. On the web’s birthday, Tim Berners Lee, its creator, published a letter stating the web’s current state of threat. He says that while it’s called the “World Wide Web,” only about half the world is connected, so we should close this digital divide.

But at the same time, Berners Lee wants to make sure this thing we’re all connecting to is truly working for us, as individuals: “I want to challenge us all to have greater ambitions for the web. I want the web to reflect our hopes and fulfill our dreams, rather than magnify our fears and deepen our divisions.”

[image]

“Metaphor unites reason and imagination,” says George Lakoff and Mark Johnson in their book, Metaphors We Live By (1980). “Metaphors are not merely things to be seen beyond. In fact, one can see beyond them only by using other metaphors. It is as though the ability to comprehend experience through metaphor were a sense, like seeing or touching or hearing, with metaphors providing the only ways to perceive and experience much of the world. Metaphor is as much a part of our functioning as our sense of touch, and as precious.”

Instead of a cloud, let’s use a metaphor that makes the web’s individual, cooperative nodes more visible. This way, we can remember the responsibility we each have in building a better web. The web is a flock of birds or a sea of punctuation marks, each tending or forgetting about their web garden or puddle home with a river of knowledge nearby.

If a website has endless possibilities, and our identities, ideas, and dreams are created and expanded by them, then it’s instrumental that websites progress along with us. It’s especially pressing when forces continue to threaten the web and the internet at large. In an age of information overload and an increasingly commercialized web, artists of all types are the people to help. Artists can think expansively about what a website can be. Each artist should create their own space on the web, for a website is an individual act of collective ambition."
laurelschwulst  knowledge  webdev  webdesign  internet  web  online  2018  websites  design  flexibility  purpose  creativity  learning  howwelearn  accumulation  accretion  making  murmurations  metaphor  clouds  birds  georgelakoff  markjohnson  completeness  unfinished  wonder  fredrogers  storage  archives  html 
may 2018 by robertogreco
Web Accessibility: What You Say vs. What I Hear | Think Company
"AVOID CREATING BARRIERS FOR PEOPLE

While the following list isn’t comprehensive, it could be a starting point for thinking about accessibility in your work and organization. Consider how you could unintentionally make it difficult for people to access your content and begin by shifting your perspective.

1. Think about accessibility from the very beginning. Communicate it across business, design, development, and testing.

2. Make accessibility a priority, a business case, and a part of your organization’s definition of “done.”

3. Include people with disabilities in your user personas and conduct research and studies with real people.

4. Make sure everyone gets accessibility training. Learn how to use assistive technology.

5. Think about multiple methods to convey information and interact with user interface.

6. Apply proper keyboard support and think about tab order. This will ensure a baseline level of accessibility for various assistive technology.

7. Design and develop according to the latest standards.
Create internal accessibility standards and requirements.

8. Let’s change the dialogue around accessibility. People want to hear what you’re saying."
via:dirtystylus  accessibility  advocacy  webdev  webdesign  web  online  internet  mikeyilagan  standards  disabilities  disability  assistivetechnology  technology 
may 2018 by robertogreco
The world’s fastest framework for building websites | Hugo
"The world’s fastest framework for building websites

Hugo is one of the most popular open-source static site generators. With its amazing speed and flexibility, Hugo makes building websites fun again."



"Blistering Speed
What's modern about waiting for your site to build?

Hugo is the fastest tool of its kind. At <1 ms per page, the average site builds in less than a second.

Robust Content Management
Flexibility rules. Hugo is a content strategist's dream.

Hugo supports unlimited content types, taxonomies, menus, dynamic API-driven content, and more, all without plugins.

Shortcodes
Hugo's shortcodes are Markdown's hidden superpower.

We love the beautiful simplicity of markdown’s syntax, but there are times when we want more flexibility. Hugo shortcodes allow for both beauty and flexibility.

Built-in Templates
Hugo has common patterns to get your work done quickly.

Hugo ships with pre-made templates to make quick work of SEO, commenting, analytics and other functions. One line of code, and you're done.

Multilingual and i18n
Polyglot baked in.

Hugo provides full i18n support for multi-language sites with the same straightforward development experience Hugo users love in single-language sites.

Custom Outputs
HTML not enough?

Hugo allows you to output your content in multiple formats, including JSON or AMP, and makes it easy to create your own."
webdev  static  html 
march 2018 by robertogreco
Robot Hugs on Twitter: "hey twitter - there's a lot of good awareness now about the fact that all users can add image descriptions to twitter for people who use scr… https://t.co/9E8wJipMaK"
"hey twitter - there's a lot of good awareness now about the fact that all users can add image descriptions to twitter for people who use screen readers. Here's some tips on how to do this well:
(This is my job)

you generally don't have to say 'image of' or 'photograph of'. Just describe what the image is conveying - what the user is intended to get out of seeing it. Some examples:

Tweet: Don't worry TO, It's going to get better soon!!
Unhelpful description: Toronto weather forecast
Helpful description: Forecast for Toronto temperatures, showing -18 Celsius today improving to -1 Celsius by Tuesday.

weet: Tired of going to conferences where the speaker lineup looks like this
Unhelpful description: headshots of featured conference speakers
Helpful: 8 headshots of featured conference speakers that are all white and male
(Don't @ me, this is to demo intent)

Tweet: "U of T's new building has some accessibility issues..."
Unhelpful description: staircase with pillar in the middle
Helpful description: a blind man collides with a large pillar that interrupts a handrail going up the middle of a large staircase

so: Don't overthink it. Make it as short as possible while describing what the photo is trying to convey. Any description is better than no description.

Note: these guidelines are what i use after doing research and consulting with visually impaired users for my work. Opinions on the best kind of description may differ - accessible design is a diverse field! I encourage you to do your own research as well.

oh, in response to a question: It's ok to mention colour if it's relevant to an image! Many screen-reader users are partially signed and use descriptions to clarify blurry/indistinct images. Also folks do understand the concept of colour...

here are some more potential examples because i love you all:

charts are hard! my attempt:
tweet: We have a new prime number and it’s 23 million digits long
Description: graph showing length of known prime numbers over time, starting at under 10 digits 1588 and increasing dramatically since mid 1900s to over 10 million digits in early 2000s

trying to conveying the joke/meaning?
description: dogs outside looking around. one dog is looking suspiciously with narrowed eyes at the picture taker.
(if you see your tweet don't feel called out! It's just an example)

oh! I should amend this - if it's a personal thing you don't have to be impersonal about it! This could read 'my dogs are looking around outside. Ruffles is looking suspiciously at me with narrowed eyes'.

ANYWAYS if anyone wants me to show the kind of description i might add to a particular image or example just @ me and I'll do my best!

i really want to reiterate that for social media in particular, personal/opinion descriptions are ok (as long as they describe the intent of the image!). i might post a selfie with description 'a selfie of me where i think my purple hair looks really cute today'

i think there's a misconception that accessibility always has to be formal and stiff. When doing 3rd party/pro content, it should err on objective, but social media is also an emotion and expressive space and image descriptions can try to capture that

seriously everyone don't stress just do your best. it will become more natural with time, i promise. you're all great!

Good moooorning everyone. I'm going to add a few more notes here based on some questions I got yesterday.

1) people pointed out that I didn't explain how to enable this setting,. My bad! On your computer or device, go to settings and privacy>accessibility and 'compose image descriptions' is an option. There will then be a field when you add an image. (not supported on tweetdeck)

2) the reason you don't need to write 'image of Bart Simpson on a skateboard' is that screen readers already know that there's an image. They typically announce something like 'image: (the description you wrote)", so 'image: image of Bart Simpson' is redundant.

3) You won't see the description after you've added it to an image, but it has become a part of the image info that screen readers see. If you want to see the description attached to an image ("alt text") on an image from your computer...

Chrome/firefox: right click on image, choose 'inspect' or 'inspect element' and the "alt=...' text in the highlighted field will be the description attached.

There are also a bunch of extensions you can add to your browser to make them visible if you want to get an appreciation for how little people actually do proper alt text across the internet and how good you are for trying!

(4) If you want to go even deeper, you can play around with some screen readers! Android has Voice Assistant found in setting > accessibility > vision, and it has a fun tutorial you can work through.

Apple products use VoiceOver. NVDA is also a free screen reader you can install and play around with, and Windows 7 and later have Narrator.

Google any of these for examples on how people use them and how to play around with them!

accessibility is a super rewarding and deep topic, and if you're interested there are tons of resources to check out. But you don't have to be an expert to do your part! Being a thoughtful poster and taking an extra 30 seconds to add descriptions puts you well ahead of the pack."
accessibility  captions  web  online  screenreaders  2018  twitter  images  webdev 
january 2018 by robertogreco
Publish good looking Google Docs
"Google Docs are nice, but they look ugly when published to the web. Well... not anymore!"



1 Edit your document in the google doc A4/Letter document interface
2 Publish it to the web...
3 Ohhh snap, the style is completely broken
4 Thanks to gdoc.pub, you get to publish it decently"



"YOUR ARTICLE
Google Docs becomes a WYSIWYG editor instantly

YOUR RESUME
Bring your good looking resume online instantly

YOUR COVER LETTER
Edit it as a document and changes apply immediately

YOUR SPREADSHEET NEW
Works with a live dashboard or any table you like

This project is open source"

[via: https://gdoc.pub/doc/e/2PACX-1vTkYJ0qIfbMDSSPYiRoIkwcags8BV610Qf7Rt0P83Y91j2o1u9eVzcqcyNA3AYr0nf1b8UjnrvSJtaD ]
webdev  onlinetoolkit  googledocs  opensource  formatting  web  online  wysiyg  publishing  epublishing 
january 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
Tome PressDigital Academic Publishing Tool
"Tome is for scholars and students to write online with media and community in mind

SIGN UP FOR TOME
Digital academic writing poses new opportunities and challenges. While there is no substitute for good writing, digital formats affect the ways we write and read on screens. Can long, scholarly arguments be sustained online? Rich media offers us ways to capture movement, sound, and other forms of 'live' practice that could not previously be included in print publications. Online and collaborative writing additionally build their own communities of readers, reaching audiences that previously did not have access to many important materials. Over the past 10 years, we have worked closely with scholars and students to develop books, dossiers, journals and other forms of online publications.

Why Tome?
Tome features MLA and Chicago referencing, academic type formatting, interactive Google maps, audio, galleries, chat, comments, blog, and annotations in a powerful but intuitive platform built on the WordPress framework. Easily manage your chapters or essays, media library, and bibliography. Share, and invite others to write and contribute for broader course projects. Publish and flatten your book when finished to preserve the material.

Do it Together
With the ability to invite multiple users, write multilingual chapters, keep blogs and easily create and manage a large, 5GB online archive, it is easy to create class-wide collaborative writing and digital humanities projects. We have created pilot programs with professors and libraries at Columbia, NYU, NYU Abu Dhabi, University of Colorado Boulder, USC, and UCSB and University of Miami to explore the role of technology in pedagogy. We have consulted with hundreds of students and scholars to create quick essays, continuing publication series, published books, and collaborative class projects.

Who We Are
We are dedicated to developing the next generation of academic writing tools and techniques. By working hands on with students, authors, librarians, archivists and visual artists, we hope to expand familiarity and participation in the digital humanities. Our interests include preservation, meta-data, tags, and accessibility. Tome's research team has involved students, professors, authors, designers, film makers, and activists. Our designers have created digital books for 10 years."
hemipress  tome  webdev  publishing  mla  annotation  digital  digitalpublishing  writing  onlinetoolkit  archives 
january 2018 by robertogreco
HemiPress –
"HemiPress is the Hemispheric Institute’s digital publications imprint, created to house and centralize our diverse publication initiatives. Using a variety of customized open-source digital humanities platforms, HemiPress includes the Gesture short works series, the Duke U.P./HemiPress digital books, stand-alone essays, and the Institute’s peer-reviewed journal emisférica, alongside interviews, Cuadernos, and other online teaching resources. It also provides state-of-the-art multilingual publication capacities and immersive formats for capturing the “live” of performance, as well as a digital “bookshelf”—the interface that houses all of the Institute’s publications and connects communities of readers across the Americas."

[Digital Books:
https://hemi.press/digital-books/

"The Hemispheric Institute's focus on embodied practice requires both methodological and technological innovation. Through our Digital Books initiative, which utilizes both the Scalar and Tome publication platforms, we seek to create media-rich scholarly publications in order to produce and disseminate knowledge across geographic, linguistic, disciplinary, and mediatic borders. Staging a unique intervention in the field of academic publishing, Digital Books allows authors to utilize not only images and video, but also multilingual subtitles, maps and geotags, audio recordings, slideshows, and photo-essays, alongside other interactive features. Whether solo-authored, collaboratively written, or compiled as an edited volume, this critical initiative invites scholars, artists, activists, and students to explore the expansive possibilities of digital publishing in a hemispheric context."



"Tome [http://tome.press/ ] is an online authoring tool that facilitates long-form publishing in an immersive, media-rich environment. Built on the WordPress framework and in collaboration with the Hemispheric Institute, Tome features a suite of custom plugins that empowers scholars, students, and artists to create innovative born-digital work. Recent Tome publications include El Ciervo Encantado: An Altar in the Mangroves (Lillian Manzor and Jaime Gómez Triana), Art, Migration, and Human Rights: A collaborative dossier by artists, scholars, and activists on the issue of migration in southern Mexico, Villa Grimaldi (Diana Taylor), and six gestures (peter kulchyski)."



"Scalar [https://scalar.me/anvc/ ] is a free, open source authoring and publishing platform that’s designed to make it easy for authors to write long-form, born-digital scholarship online. Scalar enables users to assemble media from multiple sources and juxtapose them with their own writing in a variety of ways, with minimal technical expertise required. Scalar also gives authors tools to structure essay- and book-length works in ways that take advantage of the unique capabilities of digital writing, including nested, recursive, and non-linear formats. The platform also supports collaborative authoring and reader commentary."]

[See also: emisférica
https://hemi.press/emisferica/

"emisférica is the Hemispheric Institute’s peer-reviewed, online, trilingual scholarly journal. Published biannually, journal issues focus on specific areas of inquiry in the study of performance and politics in the Americas. The journal publishes academic essays, multimedia artist presentations, activist interventions, and translations, as well as book, performance, and film reviews. Its languages are English, Spanish, and Portuguese."



"Dossier: Our dossiers are organized around a given theme and feature short texts, interviews, artworks, poetry, and video."



"Essays: We publish invited essays, essays submitted through our open calls, and translations of significant previously published works."



"Reviews: We review books, films, and performances from throughout the Americas"



"Multimedios: Multimedios are digital modules that feature the work of individual artists, artist collectives, curatorial projects, and activists movements. These video and photography, interviews, catalogue texts, essays, and critical reviews."]
publishing  americas  latinamerica  ebooks  epublishing  opensource  español  spanish  portugués  portuguese  digital  digitalpublishing  books  journals  multimedia  photography  poetry  video  art  wordpress  webdev  onlinetoolkit  scalar  hemipress 
january 2018 by robertogreco
Online Portfolio Website Made Easy - Format
"Attract potential clients and brand new opportunities with a portfolio that truly represents your work. Build your professional portfolio in just a few clicks — without learning to code."
webdev  portfolios  webdesign 
december 2017 by robertogreco
Building Flexible Design Systems // Speaker Deck
[via: "I’ve quoted from this deck more than any other this year. “No hypothetical situations” applies to all kinds of problem sets—not just design. https://twitter.com/yeseniaa/status/925840684715782145"
https://twitter.com/tangentialism/status/925842143540805638

"(Also, one reason I love this framing is that it calls implicitly for close listening and observation to unearth hidden problems)"
https://twitter.com/tangentialism/status/925848643550183424 ]
design  webdesign  webdev  yeseniaperez-cruz  listening  obsrvation  systemsthinking  flexibility  systems  layout  scenarios  patterns  christopheralexander  donellameadows  audience  content  modularity  customization  designsystems 
november 2017 by robertogreco
Why cards are the future of the web - Inside Intercom
"Cards are fast becoming the best design pattern for mobile devices."



"In addition to their reputable past as an information medium, the most important thing about cards is that they are almost infinitely manipulatable. See the simple example above from Samuel Couto Think about cards in the physical world. They can be turned over to reveal more, folded for a summary and expanded for more details, stacked to save space, sorted, grouped, and spread out to survey more than one.

When designing for screens, we can take advantage of all these things. In addition, we can take advantage of animation and movement. We can hint at what is on the reverse, or that the card can be folded out. We can embed multimedia content, photos, videos, music. There are so many new things to invent here.

Cards are perfect for mobile devices and varying screen sizes. Remember, mobile devices are the heart and soul of the future of your business, no matter who you are and what you do. On mobile devices, cards can be stacked vertically, like an activity stream on a phone. They can be stacked horizontally, adding a column as a tablet is turned 90 degrees. They can be a fixed or variable height.

Cards are the new creative canvas

It’s already clear that product and interaction designers will heavily use cards. I think the same is true for marketers and creatives in advertising. As social media continues to rise, and continues to fragment into many services, taking up more and more of our time, marketing dollars will inevitably follow. The consistent thread through these services, the predominant canvas for creativity, will be card based. Content consumption on Facebook, Twitter, Pinterest, Instagram, Line, you name it, is all built on the card design metaphor.

I think there is no getting away from it. Cards are the next big thing in design and the creative arts. To me that’s incredibly exciting."
cards  web  webdesign  webdev  userinterface  ux  userexperience  ui  design  mobile  pauladams 
september 2017 by robertogreco
🔠 Webfonts, web fonts, web-fonts
"Earlier this month Bram Stein published a book, along with the fine folks at A Book Apart, called The Webfont Handbook and it’s all about how browsers interpret our design choices when it comes to typography. Bram explores what fonts are and how they load, along with the unfamiliar CSS properties that we can use to control them.

You might not care one single iota about fonts or how browsers interact with them, and that’s totally okay, but I think this book is then interesting from two separate angles: web accessibility and good technical writing. First, on the topic of accessibility, one of my favorite sections of this book is where Bram writes about how webfonts can harm the user experience if we’re not careful. By loading too many fonts, for example, and thereby slowing the speed by which the website is requested:
Which matters most to you—conveying your message, or conveying your message in the correct font? In almost all cases, communicating your message matters most. The web is not—or at least shouldn’t be—only for the privileged. Young, affluent people with perfect eyesight using modern devices with high-resolution screens on fast network connections constitute a small fraction of internet users. Don’t forget about the rest.


Later in the book, Bram continues this argument further:
We need to start thinking of webfonts as progressive enhancement instead of expecting webfonts to be a resource that is always available. The baseline experience of your site has always been, and will always be, just plain HTML and CSS. Webfonts enhance that experience. In fact, there’s no guarantee that visitors to your site will see webfonts at all. The Opera Mini browser is used by hundreds of millions of people, and it does not support webfonts. Without you doing a thing, those users are already excluded from using the webfonts you specify.

That means there are two possibilities you should design for: when webfonts are not available, and when webfonts are available.


Accessibility and caring deeply about how webfonts impact the overall design of a website does not make us a gang of old type snobs, instead it makes us good citizens of the web. By thinking about those technical implications we show our care for everyone that visits our small island on the web, and not only the people that happen to look just like us. And every moment that we ignore web accessibility is one where the web becomes more difficult to approach and where we all become a little more isolated from one another.

The second important note that I took away from this book is that technical writing, and writing about code in general, is extraordinarily difficult. It’s tough to know what to teach and when. Not only that but it’s tricky to keep enough concentration and focus to go through each step meticulously so that someone else can follow along easily. This subject leads back to accessibility I suppose, but I can only think of a handful of people that are really good at this sort of technical writing and Bram is certainly one of them."
webdev  webfonts  fonts  html  css  accessibility  communication  robinrendle  bramstein  typography  web 
september 2017 by robertogreco
Statistics on flag colors
[via:

"what's the least common colour used on web pages?"
https://twitter.com/v21/status/911963557763407872

"digging into this a little reveals no real answers, but did turn up this lovely page on colours in flags: http://www.crwflags.com/fotw/flags/xf-csts.html "
https://twitter.com/v21/status/911970920394346497 ]
flags  color  data  statistics  webdev 
september 2017 by robertogreco
HTML5 UP! Responsive HTML5 and CSS3 Site Templates
"HTML5 UP
... makes spiffy HTML5
site templates that are:
Fully
Responsive Built on intelligent
HTML5 + CSS3 Super
Customizable100% Free under the
Creative Commons"

[via (used here): http://www.jessamyn.com/ ]
webdev  html5  responsive  webdesign  html  free  templates 
september 2017 by robertogreco
Economy
"An easy, powerful, and flexible authoring system for websites that grow with your organization."



"Magic modules

Each site begins with a bespoke set of beautifully designed modules, created for you by the design studio Linked by Air. These modules have programmatic and interactive intelligence as well as good looks. Your authors combine them in any order to create millions of possible pages. This visual grammar becomes a functional language your website can use for years."



"Responsive layouts

Pages automatically optimize themselves for display on smartphones and tablets, and just as important, for use on the go. On desktop, images and layouts stretch to immerse users with the largest displays, while preserving great typography."



"Fun and easy to use

Economy is powerful, but its interface is beautifully simple and foolproof. With just a couple satisfying gestures you know almost everything you need to create and improve pages. Many users describe a feeling of “flow,” and Economy might be the only content management system that is often called “fun to use.”"



"Version history

Economy encourages experimentation and continuous iteration. When content or a site area no longer meets your requirements, improve it. A complete visual history is kept of every page, including an automatic screenshot of each version. All edits are attributed to the user who made them, and a page can be rolled back to any previous version. Drafts can be created which are only visible to staff – not yet to the public."



"Bring in data

You can craft pages one by one using your flexible kit of magic modules, but sometimes you need a more structured approach to your data. Economy features beautiful indexes and forms that give you access at a glance to all your calendar events, exhibitions, books, products, artworks, artists, users… or almost anything else."



"Smart automation

Your site can run itself. Pages update automatically to feature the latest Twitter posts, today’s events, upcoming exhibitions, or content relevant to the logged-in user. Use the time you gained to dream up new projects. Or get some fresh air."



"Commerce as content
For sites with e-commerce, Economy has handled shops with as few as ten distinct products, and as many as 40,000. Economy integrates product delivery throughout the site, in addition to a distinct “shop” area. For example, purchasing a printed exhibition catalog is as seamless as reading a text online, and either can be done directly on a relevant exhibition page or blog post. In this way, all the amazing content on your site helps support your sales conversions. At the same time, users will value your physical products for their substance, not only as merchandise. Products are integrated with all other search results. A visible shopping cart appears throughout the site once a user has selected the first product for purchase, and Economy’s checkout flow is best of breed and highly customizable. Economy is a great mobile commerce solution, and can also integrate with an in-store point of sale system for unified inventory management."

[See also:
https://www.linkedbyair.net/
https://www.youtube.com/watch?v=YhOnOzAj5wY ]
via:caseygollan  cms  webdev  webdesign 
august 2017 by robertogreco
hello world | metaflop
"metaflop is an easy to use web application for modulating your own fonts. metaflop uses metafont, which allows you to easily customize a font within the given parameters and generate a large range of font families with very little effort.

with the modulator it is possible to use metafont without dealing with the programming language and coding by yourself, but simply by changing sliders or numeric values of the font parameter set. this enables you to focus on the visual output – adjusting the parameters of the typeface to your own taste. all the repetitive tasks are automated in the background.

the unique results can be downloaded as a webfont package for embedding on your homepage or an opentype postscript font (.otf) which can be used on any system in any application supporting otf.

various metafonts can be chosen from our type library. they all come along with a small showcase and a preset of type derivations.

metaflop is open source – you can find us on github, both for the source code of the platform and for all the fonts."

[See also:
https://en.wikipedia.org/wiki/Metafont
http://www.servinglibrary.org/journal/1/a-note-on-the-type ]
via:caseygollan  design  typography  fonts  webfonts  metafont  webdev 
august 2017 by robertogreco
18F Design Presents — Language: Your Most Important and Least Valued Asset - YouTube
"Have you ever felt like differences in language were holding your project back? Perhaps you have tried to standardize language across parts of your team only to find you have opened a huge can of worms?

The experiences we make for our users are made of language choices. We also depend on language to collaborate with the people we work with. Yet language is most often only tended to when you talk about things like content and copy.

Controlling your vocabulary is one of the murkiest messes you can take on, but it also might be one of the most impactful ways you could impact your organization’s ability to reach its goals.

In this online event, we ask information architect Abby Covert to share some strategies and tactics that could help us to pay closer attention to language choices we make."

[via: https://twitter.com/nicoleslaw/status/893280169439264769 ]
language  content  design  18f  contentstrategy  2017  informationarchitecture  abbycovert  information  webdev  webdesign  communication  vocabulary  misinformation  clarity  welcome  hospitality  audience  sfsh  mentalmodels  context  culturallyresponsivedesign  tone  nouns  verbs  wordchoice  duplicity  controlledvocabulary 
august 2017 by robertogreco
NewSchool
"NewSchool

• state-approved alternative school
• all-day school (secondary education)
• ethical, socio-critical, ecological and sustainable orientated
• inter-year groups
• interdisciplinary
• individualized project plans
• based on students’ needs
• cooking and eating together
• located in an entrepreneurial environment
• very realistic approach
• strong bonds with experts / between experts and NewSchool
• co-operations with companies, institutes, academies ecc.
• social engagement “social service”
• stays in nature on a regular basis

Listen, laugh and learn!

Especially during puberty, for many students going to school means trying to avoid schoolwork and commitments, or trying to escape all the “shoulds” they hear from parents and teachers. It seems like the only goal is getting to the next grade. We founded our school to give young people a chance of a fulfilled, enjoyable school experience that helps them to feel equipped for and to be curious about life.

Our school is a laboratory, a studio where Talents are given the chance to experiment. Each Talent will explore their strengths and find out what drives them. This is done through listening, cooperating, approaching challenges in a curious way, and following unique paths. Emotional intelligence, critical thinking, and problem-solving skills are essential for us at the NewSchool. Everyone learns from everyone else.

That’s why we go out into the real world. We experience nature, visit businesses, and go wherever the action is. We also gain new inspiration through communicating with experts (e.g. via Skype) from all over the world. Entrepreneurs, artists, managers, artisans – all of these experts are welcome at our school, no matter their ethnicity or religion. They provide information and support, or give us an insight about what their real life is like.

In cooperation with teachers, coaches, and experts, Talents develop projects, which they can pursue in a creative, engaged, interdisciplinary way working in inter-year groups. Young people and adults work together equally throughout the process, one that inspires them rather than constricting their ideas. We do learn by doing. It is our actions that spur our desire to engage with issues, groups of people, nature, and ethical questions. Talents get to know their strengths in close collaboration with others, then continue to develop them with passion.

We want to discover new things together, and to be bold in adjusting learning methods to meet today’s changed circumstances. Together, we grow to meet challenges, trust life, and allow learning to begin with the needs of the student. Old school was the past – the future is NewSchool.

NewSchool – It’s my way!"
germany  berlin  schools  education  sfsh  webdev  interdisciplinary  alternative  lcproject  openstudioproject  community  experientiallearning  place-based  middleschool  webdesign 
august 2017 by robertogreco
Y-Fi
"Experience Loading Animations / Screens in wifi speeds around the world. This website was inspired by this conversation I had on twitter. I was home (Nigeria) for a bit before I started work and was annoyed at how long I had to look at loading animations. I wondered how long people wanted to wait around the world screaming.

Notes / How this works

• Data about wifi speeds is from: Akamai's State of the Internet / Connectivity Report.

• I chose countries based on what suprised me and to get diversity across speeds.

• To get most data about loading times, I used a combination of Firefox DevTools and the Network Panel on Chrome DevTools. For Gmail I used this article on Gmail's Storage Quota.

• The wifi speeds and sizes of resources are hard-coded in so you can see them and the rest of the code at the repo.

• Any other questions / thoughts? Hit me up on twitter!"

[via: https://twitter.com/YellzHeard/status/890990574827851777 via @senongo]
omayeliarenyeka  internet  webdev  webdesign  wifi  broadband  nigeria  loading  speed  diversity  accessibility  paraguay  egypt  namibia  iran  morocco  argentina  india  southafrica  saudiarabia  mexico  china  chile  greece  ue  france  australia  russia  kenya  israel  thailand  uk  us  taiwan  japan  singapore  hongkong  noray  southkorea  perú 
july 2017 by robertogreco
Designed lines. — Ethan Marcotte
"We’re building on a web littered with too-heavy sites, on an internet that’s unevenly, unequally distributed. That’s why designing a lightweight, inexpensive digital experience is a form of kindness. And while that kindness might seem like a small thing these days, it’s a critical one. A device-agnostic, data-friendly interface helps ensure your work can reach as many people as possible, regardless of their location, income level, network quality, or device.

The alternative is, well, a form of digital disenfranchisement. Disenfranchisement that’s outlined—brightly, sharply—by our design decisions."

[See also: "The Unacceptable Persistence of the Digital Divide"
https://www.technologyreview.com/s/603083/the-unacceptable-persistence-of-the-digital-divide/ ]
broadband  empathy  internet  performance  kindness  webdev  webdesign  2017  digitalredlining  digitaldivide  us  access  accessibility  inequality  ethanmarcotte 
july 2017 by robertogreco
Unsplash | Beautiful Free Photo Community
"Beautiful, free photos.
Gifted by the world’s most generous community of photographers."
free  photography  webdev  webdesign  resources  stockphotography 
july 2017 by robertogreco
Design Resources
"Select websites, tools, assets, and readings for working in and learning about design.

[categories]
Accessibility resources
Books and zines
Browser features
Brushes
Colors and color palettes
Fonts
Icons and emoji
Inspiration and criticism websites
Mockups
Prototyping tools
Stock graphics
Stock photography
User testing and interactive feedback tools
Design Resources
Select websites, tools, assets, and readings for working in and learning about design.

made by @skullface · view/contribute on GitHub
Accessibility"
design  resources  reference  jessicapaoli  fonts  icons  emoji  webdesign  webdev  color  palettes  stockphotography  stockgraphics  graphics  browsers  zines  extensions  chrome  prototyping 
july 2017 by robertogreco
The Ultimate Collection of Google Font Pairings (Displayed Beautifully with Classic Art) | Reliable
"How this post came to be

I have to be honest - I love the concept of Google fonts, but I find the execution to always be somewhat... lacking. I don't know. When compared to classics like Futura, Bodoni, Garamond - even Helvetica - they just fall short, and I rarely, if ever, end up using them.

Can you relate?

Again, I love the concept of Google font pairings: the fast download of cool fonts (and even cute fonts) from their high-speed library is great, and has brought far more unique, web friendly fonts and font pairs to the internet than ever before. They sort of broke us out of the standard web fonts and web safe fonts we were all chained down to a few years back of Arial and Verdana and even the Times New Roman font (remember those days? Can you believe they were just a few short years ago?).

But because of that feeling of something "lacking" - I've stayed away from Google fonts. Until now.

A while ago, my partner and co-founder of Reliable, David Tendrich, challenged me to do something about it.

"Make Google fonts work," he said.

And so that's how this post was born.

I wanted to create the best font pairings Google has to offer that even high-end agency designers would be tempted to use. I wanted to assemble Google font pairs that even I would have trouble turning down.

So I combed through Google's vast library and tested hundreds of font combinations, from their most famous and top fonts like the Roboto font, Railway font, Montserrat font, Lato font, Oswald font, Lobster font, and more, to more obscure, funky ones you may have never even seen before this post.

The wonderful Rijks collection

It was also about this time that I came across the Rijks Museum's online art collection. In short, it's a beautiful collection of both classical and modern art that is 100% royalty free and available for any use you'd like. (Can you say "aaaamazing?")

I took my favorite pieces from the Rijks collection and combined them with my Google font pairings to create a truly beautiful display of Google fonts that really work. We've also organized them by filters to help you find a font to fit that project you're working on right now. You'll find dozens of font pairings you can re-use time and time again for different clients and projects.

But that's not all!

I undertook one more challenge in this project: To express these font pairings through profound, time-tested quotes on design from world-renowned designers of all styles. So we have beauty in art, functionality in fonts, and wisdom in quotes.

If you too have had trouble finding great Google fonts and combinations, this might win you over to the Google Fonts Team like it won me over. Or maybe not! The beauty of design is that, at the end of the day, our own preferences and styles are what truly matter.

One last thing:

To help you find font pairings, we organized them in two ways: Style (Serif, Sans Serif, Both), and Mood (Any, Modern, Striking, Eccentric, Classic, Minimal, Neutral, Warm).

Here's a brief explanation of each of these moods:

Modern: Feels like it was made for the 21st century, and wouldn't make sense in any other period. Typically clean, more on the minimal side, and great for projects that require a more polished feel.

Striking: Impact. Boldness. Weight. These font pairs reach out and grab you and pull you into their message.

Eccentric: Quirky. Odd. Different. These fonts communicate uniqueness in various ways. Great for personal blogs, companies in a crowded marketplace that need to be set apart, and more.

Classic: These font combinations feel like they could have existed for generations. They're reminiscent of classic, time-tested and weathered fonts that last. Great for projects that need to project confidence, reliability, style.

Minimal: These minimal font pairings say so much, with a whisper. They almost try to blend into the background and get out of the way to help you more purely take in the message. Clean. Concise. Polished.

Neutral: Some brands are like the friendly local baker who greets everyone with a smile. Others are more professional, cerebral. These neutral fonts are more on the cerebral side - conveying professionalism and cleanliness above all else. Think Helvetica, but for Google fonts.

Warm: For brands who are the "friendly local baker," these fonts are for you. They convey heart, creativity, openness. They say, "Come talk to me, let's be friends." Great for brands that have that personal touch.

So there you have it!

Beautiful fonts and combinations from Google you can use to fuel your personal and client projects. They're completely web safe fonts, and due to their vast use worldwide, I think it's safe to say Google fonts are the new standard web fonts.

(By the way, we've made this entire collection of Google font pairings into a downloadable PDF that you can easily reference at any time. You should see a small yellow tab at the bottom of your screen - click that to download the post now!)

I hope displaying them on top of various colors, with various beautiful works of art behind them, helped you envision how they might work in your projects. That was one of my biggest goals in creating this post.

An important lesson

That's actually a lesson that was greatly reinforced in me throughout this Google font quest - that how fonts are used are just as important, if not more so, than the fonts themselves.

I think often Google fonts are strewn across designs that are lacking the fundamentals of good design. They're the cool, hip thing to use - and as a result, so many people us them. But design is a spectrum ranging from bad to great, and as bell curves go, few designs are truly great.

By simple math, most designs using Google fonts need improvement. Perhaps that's where my initial bias against Google fonts came from. Design is something I take so seriously, and am so passionate about, that when I see bad or lazy design, it hurts. From seeing so much sub-par design riddled with Google fonts, I associated Google fonts with sub-par design.

A new perspective

But undertaking this challenge to create this collection forced me to see Google fonts from a new perspective. Namely, it forced me to throw away my previous conceptions and see them anew. When I did, I simply viewed them like I would anything else in a design - as an asset to be used and manipulated to achieve an end-goal.

When I had no choice but to make them work, I viewed them as something that actually "could" work. And that's where the creativity and magic began.

That leads me to another important lesson I became re-acquainted with in this process - that when we think something won't work, it won't work. And when we truly think it can, we really can make it work.

Strategies for choosing font pairs

I also wanted to talk about some of the strategies behind these Google font combinations to help you create even more of your own. Because while I have 50 here, I'm certain there are dozens more waiting to be made.

If you'll notice, there's a pattern to nearly every pair: The headline is very bold and impactful, and then the body font is very light and airy. This contrast creates a nice tension and context for the fonts. It makes it very interesting as you scroll. Our eyes and brains desire constant change and flux and small contrasts like this deliver.

Another reason the body fonts are very light and airy is that they have to be palatable and legible to the eye over the course of a long piece of text. If I throw a bold, impactful font at you for more than 10 or so words - your eye will go crazy. It's like talking on the phone with someone who only screams.

When you go from a louder headline font to a body font, there's almost a feeling of relief. The headline was a nice, momentary burst of excitement - but then the eye is relieved to handle something easier and less demanding.

Serif & Sans

In addition, still in line with that concept of contrast, I often paired a serif headline with a sans serif body, or vise versa. Again, this just emphasizes contrast and keeps things interesting.

It also takes things a step further and shifts the feel. Serif fonts tend to feel more grounded, conservative and calm. Sans serif fonts tend to feel more modern, daring, progressive. By paring the two together, you get a great balance that's interesting to the mind and the eye.

Work with what you (don't) love

Finally, in line with the attitude shift I mentioned above, in going from "Google fonts don't work" to "Let's make them work" - I purposefully chose some fonts I simply thought I'd never like or want to use in any context. If I looked at a font and felt like it was a "heck no" - I felt compelled to give it a try.

This is so important for the creative process. Often, without even realizing it, we confine ourselves to our creative comfort zones, which slowly shrink over time. But when we step outside and try something we thought we'd never like - we often have our biggest breakthroughs."
font  typography  fonts  design  google  googlefonts  free  loulevit  2017  webdev  graphicdesign  via:lukeneff  webdesign 
july 2017 by robertogreco
Spotlight: Senongo Akpem — Responsive Web Design
"We talk a lot about how designs transform across devices. Senongo Akpem talks to us this week about how his design and illustration work explores a multicultural story across different societies."
senongoakpem  2017  design  webdesign  culturalresponsiveness  webdev  culture 
june 2017 by robertogreco
Static Site CMS - Forestry.io
"A full-featured CMS for your static site with support for Jekyll, Hugo and Git"
cms  webdev  jekyll  hosting  web  static  via:jarrettfuller  webdesign 
june 2017 by robertogreco
Siteleaf - A friendly CMS for your static site
"Built for developers, Loved by everyone
Siteleaf is a content management system designed for a better web.

Develop with existing tools
Code offline with Jekyll, sync with GitHub

Edit in the cloud
Easy for non-technical clients, writers, and producers

Free your content
Access by API or generate static sites to S3, GitHub, FTP"
cms  webdev  jekyll  hosting  web  static  via:jarrettfuller  webdesign 
june 2017 by robertogreco
Glitch
"Glitch is the friendly community where you'll build the app of your dreams

With working example apps to remix, a code editor to modify them, instant hosting and deployment - anybody can build a web app on Glitch, for free."

[See also: https://medium.com/glitch/the-web-was-supposed-to-be-a-thing-we-make-c023b6e7f56a ]
collaboration  programming  classideas  fogcreek  html  webdev  coding  glitch  webapps  webdesign 
april 2017 by robertogreco
Twine Texting Project by shindigs
"A presentation layer for Twine 1.4x that allows you to tell stories through text conversations. Built on top of Jonah. Download to access the commented project file.

Please tweet me @shindags with any questions, suggestions, and especially if you made something with this asset!

Development was streamed on www.twitch.tv/shindigs "
twine  chat  2017  webdev  cyoa  texting  messaging  if  interactivefiction  webdesign 
april 2017 by robertogreco
Espied – A portfolio theme for designers and photographers
"This is a page uses “Portfolio Page Template.” The content on the page goes here and the heading above is the page title. This page also displays projects as you can see below. You can add projects from Portfolio → Add New in the admin."
wordpress  themes  sfsh  webdev  webdesign 
april 2017 by robertogreco
The Road To Resilient Web Design – Smashing Magazine
"In this context, Mobile First is less about mobile devices per se, and instead focuses on prioritising content and tasks regardless of the device. It discourages assumptions. In the past, web designers had fallen foul of unfounded assumptions about desktop devices. Now it was equally important to avoid making assumptions about mobile devices.

Web designers could no longer make assumptions about screen sizes, bandwidth, or browser capabilities. They were left with the one aspect of the website that was genuinely under their control: the content.

Echoing A Dao Of Web Design, designer Mark Boulton put this new approach into a historical context:
Embrace the fluidity of the web. Design layouts and systems that can cope to whatever environment they may find themselves in. But the only way we can do any of this is to shed ways of thinking that have been shackles around our necks. They’re holding us back.
Start designing from the content out, rather than the canvas in.

This content‐out way of thinking is fundamentally different to the canvas‐in approach that dates all the way back to the Book of Kells. It asks web designers to give up the illusion of control and create a materially‐honest discipline for the World Wide Web.

Relinquishing control does not mean relinquishing quality. Quite the opposite. In acknowledging the many unknowns involved in designing for the web, designers can craft in a resilient flexible way that is true to the medium.

Texan web designer Trent Walton was initially wary of responsive design, but soon realised that it was a more honest, authentic approach than creating fixed‐width Photoshop mock‐ups:
My love for responsive centers around the idea that my website will meet you wherever you are — from mobile to full‐blown desktop and anywhere in between.

For years, web design was dictated by the designer. The user had no choice but to accommodate the site’s demand for a screen of a certain size or a network connection of a certain speed. Now, web design can be a conversation between the designer and the user. Now, web design can reflect the underlying principles of the web itself.
On the twentieth anniversary of the World Wide Web, Tim Berners‐Lee wrote an article for Scientific American in which he reiterated those underlying principles:
The primary design principle underlying the Web’s usefulness and growth is universality. The Web should be usable by people with disabilities. It must work with any form of information, be it a document or a point of data, and information of any quality — from a silly tweet to a scholarly paper. And it should be accessible from any kind of hardware that can connect to the Internet: stationary or mobile, small screen or large.
"
jeremykeith  webdev  mobilefirst  webdesign  design  web  accessibility  mobile  2017  timberners-lee  markboulton  trentalton  ethanmarcotte 
april 2017 by robertogreco
GitHub - jkriss/altcloud: A web server with extra powers. Run your own stuff.
"Altcloud is a web server with some niceties build in so that you can create real applications without any backend code or external services.

The idea is to set up an altcloud server on something like a Digital Ocean instance or a C.H.I.P. and run multiple sites off of that single server.

Altcloud is powered by simple configuration files and uses the local filesystem for storage. It doesn't scale, and that's just fine.

This implementation of the altcloud server is written in node.js, but the specification is platform and language agnostic.

DISCLAIMER: this is beta software. Please don't trust it just yet."
jessekriss  altcloud  cloud  diy  web  webdev  servers  software  applications  webdesign 
february 2017 by robertogreco
Beaker | An experimental P2P browser
"Beaker is a Peer-to-Peer Web Browser, made for users to run applications independently of hosts. Using P2P Hypermedia, Beaker separates frontend apps from backend services, so that users are completely in control of their software and data.

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

"Beaker is a Peer-to-Peer Web Browser which lets users build socially and publish independently. Using P2P web-hosting, Beaker separates the frontend app from backend servers, so that users are completely in control of their applications.

At a high level, Beaker introduces concepts from BitTorrent into the Web. Anybody can publish a site immediately, independently, and for free, using only their browser.

Sites can contain files, data, media, and fully-featured applications. Using them, users can publish content without ceding control of the content to either an app or service. There is no walled garden. The keys that control each site remain in the user’s browser.

Public Peer services provide optional cloud hosting, so users don’t have to keep their devices online to self-host. These services provide the uptime of a traditional host, but with no lockin; a user can migrate from one service to another without any disruption.

With forking, you can modify any site, and deploy it instantly. Users can rebuild applications to work exactly how they like. Our mission is to put the tools of creation back into the users’ hands. It will be weird, chaotic, and creative – just like the Web should be!

Beaker was forked from Chrome. It is free and open-source."

[Update: mentioned here https://www.are.na/blog/scene%20report/2018/08/13/decentralized-web-summit.html ]
browsers  peertopeer  p2p  software  mac  osx  applications  internet  web  online  chrome  opensource  webdev  webdesign  beaker  hashbase  dat  beakerbrowser  p2ppublishing  decentralizedweb  p2pweb  distributed 
january 2017 by robertogreco
école de Hogbonou
[via: https://pioneerworks.org/index/ecole-de-hogbonu/ ]

"L’école de Hogbonu, first art school in Benin Republic, West Africa, foreshadowed in summer 2016 in Porto Novo, the capital of the country by the Romanian Fabiola Badoi and the German Ewa Knitter, both living and working in Paris and their international team.

Hogbonu is the name given by the first inhabitants of the city of Porto Novo. It seemed echo with the spirit of the school.

l'école de Hogbonu opens a thinking towards a notion of art where creation is neither stake nor object of fetish making or merchandise, whispered art silently in life like a heart beat.

If schools are institutions made to give individuals a set of skills in order to fulfill a role in society, then l’école de Hogbonu is a non-school without any other finality than to provide time for exploration, idleness and wandering. Melting pot of transmitting and sharing knowledge as well as uncertainties, disquiet, doubts.

Skhole, skholes
A. noun. : primary meaning : stop
a. rest, leisure;
i. studious occupation, scientific intercourse,study;
ii. place of study, school;
iii. study product, treatise, work;
b. respite, truce;
c. leisure, slowness, idleness;
B. adv.
at. at leisure, in his time, slowly, step by step;
b. with difficulty, not easily

L’école de Hogbonu offers :

defining and defending artistic identity emphasizing cultural heritage intended by the school to be explored and deepened in order to construct a consistent discourse.

building critical thinking to strenghten an aesthetical judgement by reflecting with people from various fields and horizons : artists, historians, art historians, farmers, workers, fishermen, travelers, anthropologists, shamans, priests, philosophers, sociologists, educators, architects, writers, poets, psychologists, linguists, dieteticians, musicians, beggars, actors, dancers, economists, mathematicians, physicists, geologists, art critics, theorists…

translating cultures by simple exchange, without hierarchy

opening knowledge and carving out, throwing light on the intimate relationship between disciplines

forging a pertinent vision of art and its market

inaugurating an artistic research

slowing down art production

finding alternative economies

digging the poetic furrow of life

or

remaining in the poetic wake of life

or

traveling in the poetic vein of life

..there is nothing to say, there is only to be, there is only to live. Piero Manzoni"
benin  artschools  art  education  schools  openstudioproject  lcproject  pieromanzoni  webdesign  webdev  sfsh  altgdp  slow  horizontality  transdisciplinary  multidisciplinary  crossdisciplinary  leisure  leisurearts  artleisure  slowness  idleness  non-schools  unschooling  deschooling  l’écoledehogbonu  portonovo  fabiolabadoi  ewaknitter  artschool 
december 2016 by robertogreco
Gomix
"Gomix is the easiest way to build the app or bot of your dreams

[video]

Start by remixing

You never have to start from a blank slate. Remix a full, working app to personalize it for your needs, or build on the most popular and powerful developer frameworks to create your app.

Real collaboration

You don’t have to deal with the complexity of version control or tracking changes — the built-in editor allows multiple people to edit code at once and undo mistakes as they happen, just like working together in Google Docs.

It's not training wheels

Gomix is not a limited "toy" version of a real developer environment — your Gomix app is hosted on the exact same industry standard infrastructure that the best developers use to run their apps.

We handle the mess

While you work with Gomix, we seamlessly upgrade your servers and cloud infrastructure in the background. There’s no deployment or server provisioning because it all happens automatically.

Backed by a real company

Gomix is made by Fog Creek, one of the most influential small tech companies in the world. We made Trello, FogBugz and co-created Stack Overflow.

Why Did We Make Gomix?

In some ways, Gomix is a throwback to an older era of software or the internet, when there were simpler ways to get started making cool stuff. For people who were around at that time, they'll understand Gomix easily: We’re bringing “View Source” back. Of course, they didn't literally take “View Source” out of web browsers, but the ability to just look at the code behind something, and tweak it, and make your own thing, was essential to making the Internet fun, and weird, and diverse, in its early days. And that has sadly disappeared.

Similarly, in even earlier eras, tools like HyperCard on the Mac and Visual Basic on Windows democratized software creation, letting regular individuals or casual business users create useful apps to meet their needs. During development, Gomix was even called “HyperDev”, as a nod to this history — and its early-90s aesthetic subtly nods to that heritage, too.

Whether we look at simple issues like being able to do fun things with an Amazon Echo, or hugely complex issues like trying to make tech and programming more inclusive, Gomix has a role to play in solving problems that matter. And we’re going to have fun doing it!"
webdev  bots  gomix  slack  alexa  fogcreek  remixing  programming  webdesign 
december 2016 by robertogreco
Basics of CSS Blend Modes | CSS-Tricks
"Here's another, which cleverly re-combines a color image separated into Cyan / Magenta / Yellow / Black parts (CMYK). You know that's how offset lithography works in print, right? =)"
css  cmyk  webdev  webdesign  sfsh  blending  color  blendmodes 
november 2016 by robertogreco
the new code – Create a Halftone Effect with SVG
"Creating the visual effect of halftoning - forming an image out of tiny dots of color - is easy to achieve in a web page with SVG. The technique shown here uses multiple backgrounds in a div element: one repeating grid pattern that is closely related to the effect used in my Pop-Art article, just at a smaller cell size, combined with a bitmap image. I’ve also added a transitioned greyscale filter to desaturate the colors."
halftoning  halftones  webdesign  webdev  svg  sfsh  halftoneeffect  css 
november 2016 by robertogreco
« earlier      
per page:    204080120160

Copy this bookmark:





to read