Iain Carson. design. code. make. Creative Coder Portfolio Project Samples 2017

Transcription

1 design code Portfolio Project Samples 2017 make

2 I m studying towards an MSc in Computer Science at the University of St Andrews. and I also love photography

3 design Pantheon Tableau 3 Designs grow through levels Ask the right questions, set the right goals map intuitively and write good code.

4 Pantheon Interactive information visualisation project in Tableau A vast, incomplete, list of famous people and their perceived popularity I use a combination of Excel, JavaScript and text editors to manipulate, complete and trim data. Analytical abstraction of meaningful data is based on experience, creativity, goals, domain knowledge. 4

5 Pantheon Interactive information visualisation project in Tableau Visualisation transformation, experimentation in use of marks for encoding values. 5

6 Pantheon Interactive information visualisation project in Tableau Simplify through reduction, organisation and context, to enhance cognition Calculated fields custom functions parameter switches and embedded web elements enrich interactivity beyond Tableau s default. 6

7 The audience is key. This one s for those curious children Simplicity. Reduction of data through code. Make interactivity obvious. Pantheon Depth of data. Powerful controls. Dynamic views. The client matters. Here s one for professional historians 7

8 I have a 1 st class BSc (Hons) in Natural Sciences from the University of Bath and I love a challenge

9 design The Tree of Appropriateness Sketching 9 Designing visualisations requires careful process and attention to detail. I follow the 5-sheet design process to ensure ample ideas are considered before production

10 The Tree of Appropriateness Sketching Process and Visualisation Design Data is hard to read. I start with tools that make it easier Sketching doesn t have to be neat, at first. It just has to be creative, and the more, the better. I don t get emotionally attached to sketches, no matter how beautiful they become. It s about ideas, content, and potential. 10

11 Even small ideas can lead to big changes in the final visualisation Some encodings work better than others. I save elements and ideas which may not work for one visualisation for re-use in other projects. Keeping track of ideas and inspiration helps me fast-track my design learning experience 11

12 The Tree of Appropriateness compares datasets from 1974 and It accurately represents over 140 data points and double-encodes important parameters through colour, shape and size. Sketches can be high-fidelity, accurately represent encodings, and be linked to real data. It s a sketch until it s indispensable 12 I feel strongly that even complex, multi-faceted datasets can be projected faithfully if encoded imaginatively.

13 I have 4 years work experience in high-end technical sales and team leadership. and I can t wait to learn more

14 design simplegrid SimpleGrid Full UI Process 14 UI design is immersive, almost boundless in scope. As a competent coder, team leader and project manager I m unafraid to branch into peripheral fields to make sure features will work well from the engineer to the client.

15 simplegrid I use my 4 years experience in technical sales, with elements learned from MSc courses in HCI to extract user requirements Interview Questionnaire Observation Video/audio analysis Just some of the techniques I use This system diagram was client-verified early in the design process to catch any misunderstandings I m competent in the use of a variety of UML techniques, and quick to build diagrams if it aids communication 15

16 simplegrid This is a hybrid workflow-activity diagram I created this to bridge the gap between contextual enquiry and UI design It captures the customer s workflow and offers insight into potential UI solutions This diagram was treated as a visual, dynamic UI requirements document The diagram is easily understood by both the design team and the client. 16

17 simplegrid Moodboards, concept diagrams and mockups are excellent communicators of intent and potential. I gather materials from both real and digital sources I can build UI elements in a wide range of design tools 17

18 simplegrid When building a UI, I evaluate process and workflow from the ground up. P1 P1 + P1 + As a physicist with computer science training, I m aware of how my design choices may affect technical implementation down the line. + RG1 + + C1 + I don t let that stop me from innovating. A new UI doesn t just mean new looks; it presents opportunity for improvement from the moment the user starts interacting. 18

19 simplegrid Client feedback is critical at every stage of the design process. As an experienced technical sales engineer, I know how to interpret complex specifications, and how to sell my ideas in response. I build interactive digital prototypes using PowerPoint, mybalsamiq and InVision I also see value in physical and paper prototypes 19

20 I m effective in JavaScript, C#, Java and French and I love discovering new tools

21 code I m a Computer Scientist Get me out of here C# You don t have to take coding seriously to make serious code 21

22 I M A COMPUTER SCIENTIST GET ME OUT OF HERE Watch the video 22

23 I M A COMPUTER SCIENTIST GET ME OUT OF HERE I m comfortable with both object-oriented and functional programming This project was made in C# using a Microsoft Kinect I ve also used C# to build games in Unity 23

24 I ve picked up Angular, WPF, JavaFX, Android, Processing, D3, Unity and I love using them creatively

25 code IdeaManager Android 25 With less than two months programming experience I was challenged to write an Android app in under two weeks. Here s the result.

26 IdeaManager You re probably still recovering from your Jungle Escape experience. That s OK This project is somewhat more mundane 26

27 I ve built apps for Kinect, Arduino, Android and the Web and half of that was just for fun

28 make VAPIR Processing 28 Big problems can always be broken down into a series of small problems which when addressed individually really aren t that scary.

29 VAPIRVisualisation of Audio and Physicality In Realtime DEMO VIDEO SWAY 29

30 VAPIRVisualisation of Audio and Physicality In Realtime DEMO VIDEO VAPIR augments how people experience music It creates visualisations responsive to both the music and the listeners 30

31 VAPIRVisualisation of Audio and Physicality In Realtime DEMO VIDEO VAPIR is built under Linux using an MS Kinect, Processing, and Java Minim My depth threshold algorithm identifies the nearest user in the room. 31 It then finds edges and tracks bodies.

32 VAPIRVisualisation of Audio and Physicality In Realtime DEMO VIDEO I built my own tools to explore elements of the visualisations before the final designs were implemented My sound analysis tool, made using the Minim library. It uses the Beat Detect, Fourier Transform and Buffer classes. 32

33 VAPIRVisualisation of Audio and Physicality In Realtime DEMO VIDEO I built over 20 visualisations before settling on the final four. 33

34 Everything in this portfolio was made in the last 6 months and that s only the beginning

35 make Axteroids Arduino I aim to excel instinctively. 35

36 axteroids fully functioning arcade game designed from the ground up as an experiment in event-based programming. allowed iteration on control position and software behaviour. Sensitivity tuning dial integrated following testing in multiple environments user-study based control system joystick tap with potentiometer calibration LED feedback physical interface powered by Phidget 36

37 coded in JavaFX hybrid event/game-loop architecture infinite starfield animated background scorekeeping + hi-score unlimited waves of AI-driven enemies 37

38 That s me please get in touch