The modular future of CSS

Sep 2016

12 Mon

13 Tue

14 Wed

15 Thu

16 Fri

17 Sat 08:45 AM – 05:55 PM IST

18 Sun

Make a submission

MLR Convention Centre, J P Nagar, Bangalore

Theme: designing for mobile, wearables and desktop

We’re already in a world where smartphones outnumber all the desktops and laptops put together. Wearables – smart watches and devices – now act as remote controls for notifications on our phones.

A sizeable portion of your existing user base could be accessing your website only through a handheld device. While it is quite likely that future web users will never experience your site on a large screen, we also have instances where users prefer to respond to notifications on their desktop. Desktop apps are not going away either.

Meta Refresh 2016 will focus on enhancing web experience on mobile, wearables and the desktop

We’re looking forward to talks about:

Evolution of web design in your organisation: what is the context of your business and customers? Why and how did you evolve your UX strategy and practice for mobile devices, desktop and wearables?
How do you understand your users?
How do you acquire new users through design, especially in non-existent markets?
How do you design content for mobile and desktop websites? What kind of detailing is involved here?
How do you show notifications to users on all these channels – desktop, mobile and wearables?

We are accepting proposals under the following sections:

Design process outlining concrete steps.
Design and user acquisition.
Content design.
Push notifications and how design varies based on the medium?
User research and insights.
Performance and front-end tools – crisp talks only.
Maintainability challenges.
Accessibility.
Localization.

Criteria to submit conference proposals

You must be a practising web developer or designer, and must be able to show how your own work has advanced the state of the web in the past year. You are expected to present original work that your peers — this event’s audience — recognise as being notable enough to deserve a stage. If you are excited about someone’s work and believe it deserves wider recognition, we recommend you contact them and ask them to submit a proposal.

Guidelines for submission

Every proposal MUST be accompanied by:

A three minute preview video where the proposer gives an elevator pitch about the talk.
Detailed outline of the talk – either in the form of draft slides, mind map and/or textual description.
If you are proposing to speak on a topic where the code is not open-sourced yet, the editorial panel will consider your proposal only if the code is made open-source at least three weeks before the conference.

Without the above information, your proposal will not be considered for review.

If you are submitting a Workshop Proposal, you must clearly state:

Background knowledge that participants must possess in order to attend your workshop.
Details and links to software / packages which participants must install before coming to the workshop.
Laptop configuration.
Links to background reading material and GitHub repos.
Duration of the workshop.
Maximum number of participants who can attend your workshop.
Instructor’s past experience with conducting workshops.

There is only one speaker per session. Workshops can have more two or more instructors.

Entry is free for confirmed speakers.

If you are an outstation speaker, HasGeek will do its best to provide a grant that covers part of your travel and accommodation expenses in Bangalore, subject to budgetary constraints. Grants are made available only to speakers delivering full sessions (40 minutes or longer) and workshops.

Commitment to Open Source

HasGeek believes in open source as the binding force of our community. If you are describing a codebase for developers to work with, we’d like it to be available under a permissive open source licence. If your software is commercially licensed or available under a combination of commercial and restrictive open source licences (such as the various forms of the GPL), please consider picking up a sponsorship. We recognise that there are valid reasons for commercial licensing, but ask that you support us in return for giving you an audience. Your session will be marked on the schedule as a sponsored session.

Format

The 2016 edition is a single-day, single-track conference on 17 September. We invite proposals for:

Full-length 40 minute talks
A crisp 15-minute presentation
Sponsored sessions, 40 minute duration
Workshops – 3 to 6 hour hands-on sessions

Important dates:

Deadline for submitting proposals: 29 August 2015
Conference date: 17 September

Venue

Meta Refresh will be held at the MLR Convention Centre, J P Nagar, Bangalore.

Contact

For more information about speaking proposals, tickets and sponsorships, write to info@hasgeek.com or call +91-7676332020.

Hosted by

Meta Refresh

Meta Refresh is an umbrella forum for conversations about different aspects of design and product including: UX and interaction design CMS, content management, publishing and content marketing Information architecture more

All submissions

Previous Next

This submission has been added to the schedule

The modular future of CSS

Submitted Aug 30, 2016

Section: Full talk Technical level: Intermediate

“CSS is broken”—or Is it? Let’s learn about writing CSS without losing your sanity by rethinking the way we look at CSS styling. In this 30 minute talk, we’ll dig into how many developers have solved their CSS woes using modular thinking.

In this talk, we’ll learn about:

A brief history of semantic CSS — a recap on the rise of CSS positioning, and the evolution of the “separation of style content.”
Today’s CSS conventions — a look on how we’re solving these issues today with the help of SMACSS, BEM, and RSCSS.
Thinking in modules — let’s explore the core methodology of modern CSS: breaking apart interfaces into modular pieces.
The future of modular CSS — an exploration of current and upcoming technology of how we’re pushing forward the ideas of modular CSS.

Outline

Act 1: The problem

A brief introduction to answer the question, “Why is writing CSS so hard?”

A brief history — how have we been building CSS over the years? It used to be easy to write CSS (pages were simpler then), but we’re still using the same CSS as our apps have gotten more complex.
Where things break down — Let me walk you through how developers are often frustrated by CSS. Typically, it’s because people write them wrong.

Act 2: Existing solutions

Let’s have a look at how others have solved this problem. I’m going to walk you through some popular solutions, and let’s find out what they have in common.

OOCSS (2011) — One of the first few (CSS systems. Tells us to build sites “like Lego.”
[SMACSS] (https://smacss.com) (2012) — This tells us to think of your CSS in layers: base, layouts, modules, and states
[BEM] (http://bem.info/) (2013) — It takes SMACSS’s ideas and makes a convention out of it.
React (2014) — We’ve been building websites as components. It’s a natural extension to the component-style thinking.

Act 3: Think in components

It seems the common theme here is to building your UI as components. Here’s some more on the matter.

[Atomic design methodology] (http://atomicdesign.bradfrost.com/) — It tells us to think of your site content in components (“molecules”) that are comprised of smaller components (“atoms”).

Act 4: What’s next?

It seems the common theme here is to building your UI as components. Here are some recent projects that extend that line of thinking.

[RSCSS] (http://rscss.io/) (2015) — It takes BEM and makes a better naming convention from it. I’m the author of RSCSS, so I’ll probably say a lot here.
[Web Components and Shadow DOM] (https://www.w3.org/wiki/WebComponents/) — A proposal to have first-class support for components.
CSS @scope — a proposed extension to the HTML standard.
[CSS modules] (https://css-tricks.com/css-modules-part-1-need/) — Devs have been writing React with “CSS modules”: CSS that’s scoped to a certain element.

Requirements

An open mind.

Speaker bio

Rico Sta. Cruz is the web developer/designer behind many popular open source JavaScript libraries in use today. He is one of the top contributors at GitHub, host of JSConf Asia 2013, and the head organizer of the Philippine JavaScript community Manila.js.

Links