set the channel description: A place to discuss Storyboard, the Compose based presentation framework: https://github.com/bnorm/storyboard

set the channel topic: Storyboard, the Compose based presentation framework.

I love this thing

Hope y’all don’t mind me doing stream-of-consciousness reactions to using Storyboard and ideas on what I want from it!

The picker is so cool. In theory Keynote could do this, but it doesn’t

I am building my first deck at 1920x1080, which is what Keynote defaults to. I think it’s also a good resolution for presentations

Any guidance on what

.sp

means in Storyboard? I want my presentation layouts to be less dynamic than software, and so I really don’t want to think about running my presentation on a different device and having the text size different.

I would like a button in the Easel to resize the window to be ‘1:1’ with my presentation’s configured size. Automatically scaling to the window looks good and works good, but when I add assets and stuff I want to be able to do exact pixel math and not worry about scaling geometry

The code highlighting is so rad, but I think there’s a bunch of work necessary to do it really right. In my very first sample I had a code snippet that was just the body of a function, and highlighting that really didn’t work.

I wonder if we could do what Dokka does for external files ... point it at a real

.kt

file that compiles, and snip out the part I want. This is going to be a lot of configuration complexity! But I could be confident that my code samples really build, and maybe even sync with the presentation?

In any case Storyboard isn’t really that opinionated here... I can try to build something and if it works I’ll try to contribute it

Love the stream-of-consciousness! In general, feel free to open as many tickets as you want for any rough edges you find. I'm happy with the general design of the core storyboard API, but storyboard-easel still has lots of rough edges and even more in storyboard-text. I'm very open to all ideas and contributions to improve any and everything.

My tip of the day: There are a couple times in my stories where I want to animate the scroll position and I want it tied to the scene frame transition. For this, I'm using the following little Composable. Not sure it's the most optimal, due to dispatching the delta during composition, but it seems to work quite well.

@Composable
fun <T> Transition<T>.animateScroll(
    scrollState: ScrollState,
    transitionSpec: @Composable Transition.Segment<T>.() -> FiniteAnimationSpec<Int> = { spring() },
    label: String = "ScrollAnimation",
    targetValueByState: @Composable (state: T) -> Int,
) {
    val scrollPosition by animateInt(transitionSpec, label, targetValueByState)
    scrollState.dispatchRawDelta((scrollPosition - scrollState.value).toFloat())
}

Ooooh

In Keynote I’ve simulated scrolling by moving the content around

Storyboard now has SNAPSHOTs published for those that don't want to use an include build. A first alpha release will probably land sometime this weekend. https://github.com/bnorm/storyboard/tree/main?tab=readme-ov-file#2-snapshots

repository {
  mavenCentral()
  maven("<https://central.sonatype.com/repository/maven-snapshots/>")
}
dependencies {
  implementation("dev.bnorm.storyboard:storyboard:0.1.0-SNAPSHOT")
}

Show-n-Tell Friday: Droidcon presentation is progressing well.

scale

+

wrapContentSize

+

offset

is a pretty powerful combo, especially when you animate scale and offset.

I love it

First alpha release is available! https://github.com/bnorm/storyboard?tab=readme-ov-file#usage

dependencies {
  implementation("dev.bnorm.storyboard:storyboard:0.1.0-alpha01")
  implementation("dev.bnorm.storyboard:storyboard-easel:0.1.0-alpha01")
  implementation("dev.bnorm.storyboard:storyboard-text:0.1.0-alpha01")
}

How is everybody's storyboarding experience going? I know a couple of you were going to attempt using Storyboard for droidcon NYC. Gave up because something in particular was too difficult? Struggling with a particular API of Storyboard? Want something new in the easel library to support your presentation experience? Finding documentation of features lacking and looking for a personal demo? Would love to hear any feedback you might have!

I’m struggling a bit mostly cause I’m trying to do 2 things at once: draw the presentation and code it

My current strategy is to start in Keynote and then I’m gonna redo in Storyboard

Yeah, I totally get that. In general I've found that writing a presentation with Storyboard is actually harder than with other tools. But it allows such extreme control over the presentation design and animations and makes things possible that would be completely impossible in other tools. Hot-reload does make things easier, but it doesn't close that gap. I've noticed it does get a little easier with each new presentation. Maybe it's because I've built my little library of presentation patterns / Compose functions? Maybe it's difficult because there isn't a library with a bunch of template designs? Or maybe it will just always be harder because it's harder to code something? I'm not sure.

Looking for some feedback on my (very incomplete) slides before I fully commit to a couple ideas: https://deck.bnorm.dev/dcnyc25/. If you have a couple minutes, I would appreciate thoughts on the following: 🧵

Just started getting everything set up, the examples in https://github.com/bnorm/storyboard are super useful to get all the pieces plugged together One note - it looks like

storyboard-easel

is expecting

material2

usage, not

material3

? It looks like a usage like here pulls out configuration from the

material2

MaterialTheme

SharedTransitionLayout

is fun! And state driven slides are the best.

A new alpha version -

0.1.0-alpha02

- should now be available. A few minor API changes and some improvements to the syntax highlighting: https://github.com/bnorm/storyboard/compare/0.1.0-alpha01...0.1.0-alpha02

Alex wanted XML highlighting, so he gets XML highlighting!

0.1.0-alpha03

should now be available. https://github.com/bnorm/storyboard/compare/0.1.0-alpha02...0.1.0-alpha03

I spent a bit of time working on arrows (and not done with my talk yet 🙈) Pretty happy with the usage though ->

Been experimenting with a "DecorationLayout" (or maybe just DecoratedLayout would be better?) for drawing lines and other "decorations" on Composables. Inspired by the above thread. https://github.com/bnorm/storyboard/pull/28