internetvin

Interfaces

Making some kind of Interface for 365 consecutive days

Spent most of my time working on a film about Futureland today. Just seeing how a video might fit into this concept.

Adding a table of contents to this concept that explains the history of Futureland and other data.

a sketch of a page that explains the current state of Futureland, aspirations, hypotheses, challenges, data.

Trying to eliminate the pop up window when users are adding collaborators to Journals.

Ideas on how users will add collaborators to their Journals

Starting to sketch out a concept for a new screen

Building on this full screen comment window..

I'm still on a limited schedule but I played with this a bit more, randomly dragged the comment window out to the full width of the image and its kind of interesting.

Trying to make more visual improvements to comments. Not happy with the way this right now...

Trying to make some visual improvements to comments on Futureland.

Thinking through visual improvements to comments on Futureland

Sketching out ideas for how to handle collaborative Journals on Futureland.

A little more work on this onboarding concept. Spent the whole day writing code. I'll probably take a break from this for now because something about it feels off right now. My mind is pretty occupied by with some code I'm trying to work out.

A bit of work on this visual onboarding thing

More sketches on how to introduce people to Futureland

A few more steps with this visual onboarding concept

Working on a new visual onboarding concept for Futureland. I'm feeling pretty good about this. The idea is to create something that feels like a video but occurs right on the Interfaces that the user will be using. This could be an interesting way of sharing the purpose of each Interface and its components.

Experimenting with more visual on boarding concepts. This still needs a lot of work but I'm getting a better sense of how to handle this. It's kind of like a video that explains something, but each component of the explanation is triggered by a click in a visually appropriate location.

Starting to think through some visual onboarding concepts for Futureland. A lot more to do here.

Very tired, just sketching whatever tonight. Good night

Making some more minor tweaks to Futureland's home page.

Early sketches on some kind of project based feed for Futureland. A lot of work to do here.

Making a few more improvements to the home page concept. I'll work on this more tomorrow.

Thinking through more improvements to Futureland's home page. I need to make a video assets to continue to get a feel for this. I'll probably do that tomorrow.

Sketching out improvements to futureland.tv

Still trying to figure out the best way to handle comments, needs more attention.

More thinking on how to handle comments, what if I force everything to the right side? I still have a lot to learn about screen design in general.

Thinking through how comments might work on Futureland outside of the timeline.

Sketching out new improvements to Futureland's homepage. Updating all of the Interfaces to display the current iteration of the tool, considering how visitors might be able to explore projects and building out components that show various use cases. I'll need to start making a few videos to progress further on this update.

More work on the timeline of Journals

Sketching some thoughts on improvements to Journals.

Thinking through how users will edit projects.

Thinking through how a new user might select a profile picture when they first start out on Futureland. I'll need to start thinking through a settings menu soon.

My friend and filmmaker Karl Kai came by the house today. He set up his profile on Futureland - futureland.tv/karlkai - and gave some really good feedback on the tool. It was a lot of fun. This oscillation of working all day on something and then opening that something up to feedback in the evenings has worked really well for me in Film and it seems to be working well in Software as well. Here I'm thinking through how we might realize some improvements to the timeline on the Project Journals. I'm really excited about this.

Worked on a bunch of different Interface improvements today in Sketch. This is an Interface to create new projects on Futureland. It's a system that was created when we were trying to figure out how new users would register for Futureland. The concept is we cut to a full screen Interface that is hyper focused on a singular purpose in certain key instances. Here we are repeating this system when a user creates a new project on Futureland.

Spent a few hours working on improved interfaces for some upcoming changes to Futureland.

Working on concepts for a profile that displays a user's projects.

This is the longest amount of time I have spent designing in a single day. It was fun, I'm learning a lot.

Working on concepts for a new homepage and project creation workflow. We made a lot of progress on this today.

Sketching some ideas for handling audio on the output editor. Had a good session in general today working on Futureland interfaces with Lucas.

Here I am working on an improved login screen for usability. It's an easy Interface to use but everything is too small on the screen right now. Then I spent a bit of time thinking about buttons. And then reworked the publishing view again with the results of my button experiments. I'm liking where it is going. It seems like the more I strip away elements and focus on spacing, placement and size, the better things feel. Tomorrow Lucas Fischer, a software developer arrives in Toronto from Germany. We met on the Internet about 45 days ago. I rented a house for us in a cool neighbourhood in the city. We'll be living together for a month and working on Futureland. It'll be interesting to see what happens. I'll write more about this tomorrow.

I am still tweaking the publishing view. I started removing more elements, playing with the typography and weight. I adjusted spacing as well and had a lot of good conversations about UI today in general. It's interesting how detailed it is and how much you have to just keep playing with things until it starts to really work. It's just like learning other disciplines as well in that you have to be willing to make a bunch of terrible things before you make good things. This can be harder when it's visual. Most people don't want to be seen as someone who lacks taste or aesthetic sense, but the reality is that it's about combining patterns, learning from references, understanding people and computers. The idea that you can just start organizing all of those things into coherent Interfaces is not realistic. It takes time and it takes practice. You have to make a lot of things and see what happens.

Giving myself a bit a break tonight. Just some simple stuff. Good night.

Still reading about interface design and applying some of those lessons to sketches of the publisher on Futureland. I'm still learning about visual hierarchy and the appropriate ways of emphasizing something, often by de-emphasizing something else. Tonight is my last night Mexico and I'll be flying back to Toronto in the morning for an intense January and February.

I spent a bit of time studying Interface design before creating something in Sketch. I did this a lot while learning how to code, reading a lot of books and creating at the same time. I think a natural transition is happening in which I'm starting to put more focus into design. For something to feel designed, it has to feel as if a lot of thought and consideration has gone into each material you are seeing. When something feels 'designed', it's as if it 'knows' you in some specific context. Perhaps quality of design = quality of thought expressed through materials.

Spending some time thinking through how users might interact with someone else's project. There's still a lot of work to be done here. I also need to start spending more time studying user interface design in general. Both the technical operations of Sketch and various design philosophies as well.

Thinking through improvements to the upload interface. Making text bigger, changing the word 'push' to 'upload', increasing the size of buttons and refactoring the layout of the audio interface. Will continue experimenting with this over the next few days. There's a lot more I have to study and experiment with, but I'm learning a lot.

Limited time today. I spent the time that I did have thinking through elements for the audio interface on Futureland. I'm so used to putting most of my time into writing and studying computer programming. I need to figure out how to put more of my time into designing Interfaces. In a way it seems like making interfaces is a new medium than writing code. The way we interact with computer based devices has changed so much that it seems the interface design industry is still learning what's possible and makes sense on all of these new screens and the contexts they enable. Whereas; the computer programming concepts underneath these devices have been the same.

I spent a bit of time tonight thinking through an audio interface for Futureland. The interesting thing about Interfaces is that they need to look attractive and be functional. I can't imagine how a designer could nail both perfectly on a first attempt. Perhaps you start making an interface a certain way because you believe it ought to function that way. And then by watching someone else use it you see many of the subjective ideas and beliefs you brought into your design. Now with this new knowledge and awareness, perhaps you can make something better. It seems if you want to make things that people love using, you have to get good at observing the world around you. Asking, "what is so special about the things we universally love?" and then regularly translating those observations into materials until you find the answer.

Thinking through how to handle the selection of multiple outputs to add them to a collection or delete them. I've worked out two different concepts here so far. (1) the user would select a bunch of outputs and then 'groups' would appear that they can add them. (2) the user would select a bunch of outputs and then an input interface would automatically appear where the user can just start typing and it will auto complete with existing projects that the user can push to. I also created a new concept for a delete button. There's a lot to fit on these Project views. It's an interesting challenge trying to figure out how to keep a particular view focused but also 'fast' meaning whatever a user might need is immediately available to them. It seems you kind of have to predict what the user is going to do on each view. It definitely helps to use the tool yourself.

Thinking about how collections or groups of outputs might work on Futureland

Experimenting with a new way to view outputs on Futureland that puts more emphasis on the content and functions as a timeline. As you scroll an indicator the left will display the date. Perhaps it could go back beyond a year to show progress over multi-year time scales. For example, I am still coding every day beyond 365 days. Or perhaps it functions as a central feed of user's output across all projects as far back as the beginning.

Making improvements to web publishing interface.

Starting to think through how users might publish audio to Futureland using a web interface.

Various interfaces I worked on or refined today while working on web publishing for Futureland

Putting together interfaces for a prototype of web publishing on Futureland

Working on interface concepts for publishing to Futureland on mobile

Adding more components to publishing interface on Futureland

Experimenting with a text based Futureland profile

More thinking on how project selection / tagging might work when users are publishing outputs on the web. I like this simpler approach.

Some quick thinking on wire frames for how projects would be displayed during publishing outputs..

Quick mock up of confirmation after a user adds authentication to their accounts. I'll probably scrap this.

Thinking through Interfaces that help existing users enable authentication on their accounts.

Spending a bit of time thinking through web publishing. I'll work on this more tomorrow.

Ridiculously simple login page to start running some experiments on user authentication

Improving how new Futureland projects are started on mobile devices.

Another version of a simple on boarding screen that is displayed once a user starts a project on Futureland Alpha.

Thinking through a concept where after a user starts a project on Futureland, the screen goes black and a text message conversation starts with the user.

Finishing off improvements to how new users sign up for Futureland: Alpha

Making improvements to the Interface users see when they are starting a new project on Futureland

Sketching out interfaces for the next version of Futureland

Sketching every Interface for the next version of Futureland. It's going to take a lot of output to get every view moving in the right direction

Thinking through a profile view where you can navigate through a users various projects and other elements.

Thinking through improvements on how new projects are started on Futureland

Thinking through an improved version of how each output is viewed on Futureland. This new view includes, multiple forms of media, better typography, and ability for other users to have a discussion about each output. The challenge in figuring this out is creating an Interface that serves various depths of sharing. It should work well if a user shares a single image with no text and also if the user wants to share multiple forms of media and a lot of text.

Separating Profile View and Project View. This seems to be an important insight in how all of this should work.

Wire framing how to add more functionality to profiles... need to think through how users can navigate through various projects, sign in, publish and edit their outputs.

More wireframing

Applying what I'm learning about wireframing to Futureland

Learning about libraries and overrides

Learning about symbols and overrides

Studying wireframes

More practice / study laying out Interfaces

Studying and practicing laying out interfaces

Studying and practicing laying out interfaces

Studying and practicing interface layout

more practice with icons .. a lot to learn

Learning a bit about icons..

menu exploration

Exploring profile interactions for next version of Futureland

Thinking through some improvements on how users start new projects on Futureland

limited time. quick experimentation

very very tired, some random experimentation

Some random experimentation while on a very tired flight to Toronto

More development on how users are eventually going to interact with and explore their Futureland projects.

Building on interfaces interactions for when users publish to Futureland

Been a tough few days mentally, but still progress because of Futureland. That's what I really like about this process, helps me get out of my own way.

Experimenting with interface animations. This seems like a much clearer way of communicating ideas. It also forces me to work through nuances that I might not notice when working with static designs. For example, when you push this purple square in the left corner, it should transition in some way with the other elements. I did not notice this until I started animating the Interface.

Experimenting with a quick way to get more information about a project on Futureland

More exploration into various components of profiles.. thinking about how users might connect various projects

More work on how users will use and navigate through various functions of their Futureland profiles

Thinking through various ways to navigate around Futureland profiles

Thinking through how logging in and other functions might work on mobile. I am finding that for me to feel confident in my design decisions I need to produce many interfaces

Limited time tonight, exploring how additional settings could be handled on this Interface. Need to tweak my process for more focus in the coming days

More iterations of publishing and logging in on Futureland

Thinking through mobile interfaces for Futureland

Pulling inspiration from other interfaces to think about how futureland could look on smaller screens

Creating interfaces for something I was working on called Desk, it allows anyone to turn any place into a coworking space.

Just trying something new, revisiting a concept I was working on before I knew how to code called Desk

Trying something new, just revisiting a concept I was exploring before I knew how to code called Desk

Thinking through a simple settings menu, might scrap this

Feeling out of it today

I think I have worked out how to handle user login programmatically, so just thinking about how the Interface should handle it.

I am getting a better understanding how to implement web publishing to Futureland profiles programmatically, so putting together an Interface to handle it

Imagining what this Interface might look like on wider dimensions

Exploring functionality through two big simple buttons

Playing with this abstracted Interface to see what I learn

Abstracting a Pinterest profile to see what I can learn. Seems well balanced.

Spending some time abstracting an Interface to see what I learn, I might do a bunch more of this

This is all over the place right now, but it doesn't matter. Just trying to imagine what it would be like if the first visual of Futureland was some kind fly over of a futuristic city or place.. long way to

Thinking through the first screen a user might see after signing up for Futureland. Just starting out, a lot of thinking and prototyping needs to be done with this.

Thinking through various ways people might start Futureland projects

In the process of bringing new functionality to Futureland on the web. Part of that is reworking how users start projects.

Quick thinking through how output pages should reflect style changes I've made to the rest of Futureland profiles. Will likely publish this tomorrow.

More experimentation into what public profiles might be like on Futureland

Starting to think about a concept for Futureland public profiles where you can: (1) read a bit about a user, (2) see the projects they have completed, the projects that are in progress, the projects that have been archived (3) and find links to their other internet profiles (twitter, instagram, soundcloud)

Exploring what an expanded view might be like on Futureland profiles. There's a lot of experimentation to do to figure out the best way to display a variety of different projects

Exploring new ways in which Futureland could display individual outputs.

More subtle improvements to Futureland profiles as I'm learning more about designing with base 8. I'll be publishing an update to profiles soon.

Exploring the various ways users might add outputs to their Futureland projects

More exploration into how users might login and publish to their Futureland profiles

Exploring how user login might work on Futureland profiles

No time tonight

More studying of and experimentation with designing in base 8. I have a lot to learn

Trying to understand the impact of a base 8 system by applying it to Futureland profiles. I have to practice this a lot more.

Studying the work of who created reading.supply and other work I really dig.

Don't have my MacBook Pro charger, had to do all of this on 10% battery.

Imagining the first screen once someone logs into Futureland

Quick interpretation of Are.na one of my favourite tools

Opened Sketch and created whatever came to mind.

Creating a desktop iteration of the first screen someone sees when visiting Futureland

Imagining another design of the first screen someone sees when visiting Futureland

Imagining new home pages for Futureland

Imagining how users might publish outputs to their Futureland projects. This kind of interaction probably makes for desktop.

Exploring how new improvements to Futureland profiles will look on larger screens

Limited time today. Beginning to explore what some new interface improvements might look like on Futureland profiles on desktop.

Thinking more about how exploration might work on Futureland

Starting to think about what project exploration might be like on Futureland

Thinking about how users might publish project outputs directly via their profiles interface. I need to do a lot more research and experimentation on this.

“Imagining new Futureland profiles. When someone taps a user's profile picture, the primary interface fades into the background and a bio becomes an overlay."

Continuing to imagine new functionality and improvements to Futureland profiles...

Exploring new functionality on Futureland profiles. A lot to think about here and more iterations required.

Building on this Interface that users see once they have started a new project. Still not completely satisfied but a better starting point.

Creating a screen that is shown to users after they start a a new Futureland project. Not satisfied with this yet.

Starting to think about how this new project interface should look on larger screens. I'll start porting this over to html/css later today

Building on the Interface I created yesterday for users starting new projects

Starting to improve the experience for users starting new Futureland projects. This is a draft of the first Interface they may see.

Recreated another interface from Things. Couldn't figure out exactly how to model the same keyboard

Limited time today. I recreated the iOS calculator. I am sure there are so many things I'm doing wrong right now in terms of how I am using Sketch. Today I started to get interested in the subtlety of an Interface.

This is the first output of my new concurrent Futureland project in Interfaces. In this project, I will make some kind of interface for 365 consecutive days, In this output I have recreated the main screen of the 'Things' app for iOS.

00:00
internetvin
internetvin Interfaces